/* sample style sheet for wiliki */

body {
  font-family: verdana, arial, helvetica, "Noto Sans JP", sans-serif;
  color: black;
  background-color: #eeeedd;
  margin-left: 2em;
  margin-right: 2em;
}

h1, h2, h3, h4, h5, h6 {
   text-align: left;
   line-height: 1.5;
   font-size: 1.0em;
   /* color: #006655; */
   color: #050550;
   background: transparent;
}
h1 { font-size: 190% }
h2 { font-size: 160% }
h3 { font-size: 130% }
h4 { font-size: 120% }
h5 { font-size: 100% }
h6 { font-size:  90%; font-style: italic }

pre {
    margin-left: 2em;
    margin-right: 2em;
    font-family: monospace;
    background-color: #ddeeee;
    border: solid thin #aacccc;
}

pre.macroerror { 
    background-color: #ee5555;
}

blockquote {
    border-left: solid thick #ddbbaa;
}

blockquote > blockquote {
    border-left: solid thick #bb9988;
}

blockquote > blockquote > blockquote {
    border-left: solid thick #997766;
}

dt { font-weight: bold }

td.inbody { background: #dddddd }   /* used in formatted body */
td.preview { background: #eeddaa }  /* used in preview page */

input.navi-button {
  margin: 0pt;
  padding: 0pt;
  background-color: #dddddd;
  border: solid 1pt #777777;
}

input.search-box {
  margin: 0pt;
  padding: 0pt;
  border: solid 1pt #777777;
}

input.navi-button:hover {
  background: #ffffee;
}

span.breadcrumb-links {
  color: #444444;
  font-size: 90%;
}

span.wiliki-alert { background-color: #ff8080; } /* used to warn internal error */

input[type=text] {
    background-color: #F0FFF5;
    color: black;
    border: none;
    font-size: 100%; font-weight: normal;
}

/*
 * Comment
 */

div.comment { 
  font-size: 90%;
  padding: 0pt 3em 2em 3em;
  margin: 0pt;
}

div.comment .comment-input {
  margin-left: 20pt;
}

div.comment .comment-area {
  width:  60ex;
  height: 10ex;
}

div.comment > p.comment-caption {
  border-left: solid 4px #006655;
  border-bottom: solid 1px #006655;
  padding: 0px 3px; margin: 8px 0px;
}

div.comment > div.comment-past > h2 {
  font-size: 100%; font-weight: normal;
  padding: 0pt; margin: 0pt;
}

div.comment > div.comment-past h2 {
  font-size: 100%; font-weight: normal;
  padding: 0pt; margin: 0pt;
}

div.comment > div.comment-past h3 {
  font-size: 100%; font-weight: normal;
  padding: 0pt; margin: 0pt;
}

div.comment > div.comment-past h4 {
  font-size: 100%; font-weight: normal;
  padding: 0pt; margin: 0pt;
}

div.comment > div.comment-past h5 {
  font-size: 100%; font-weight: normal;
  padding: 0pt; margin: 0pt;
}

div.comment > div.comment-past h6 {
  font-size: 100%; font-weight: normal;
  padding: 0pt; margin: 0pt;
}

div.comment > div.comment-past > blockquote {
  border: none;
  padding: 0pt 20pt;
  margin: 0pt 0pt 5pt 0pt;
}

div.comment > div.comment-past > blockquote * {
  padding: 0pt; margin-top: 0pt; margin-bottom: 0pt;
}

textarea {
  background-color: #F0FFF5;
  color: black;
  border: none;
  font-size: 100%; font-weight: normal;
  margin: 2pt 2pt 5pt 5pt;
}

/*
 * Tag
 */

span.tag-anchor {
  background-color: #ffdddd;
  font-size: 90%;
  font-style: italic;
}

input#submit_button {
  padding: 15px 40px;
  font-size: 2.4em;
}

a {
  text-decoration: underline;
  line-height: 1.5;
  font-size: 1.0em;
}

li {
  line-height: 1.5;
  font-size: 1.0em;
}

td {
  padding:  5px  5px;
}

tr {
  padding:  5px  5px;
}

/* Additional styles for new site */

/* Forms */
.form-group {
  margin-bottom: 1em;
}

.form-group label {
  display: block;
  margin-bottom: 0.3em;
  font-weight: bold;
}

.form-group input[type="text"],
.form-group input[type="email"],
.form-group textarea {
  width: 100%;
  max-width: 400px;
  padding: 0.5em;
  border: 1px solid #999;
  background: #fff;
  font-size: 1em;
}

.form-group textarea {
  max-width: 600px;
  height: 200px;
}

.required {
  color: #c00;
}

/* Buttons */
.btn {
  display: inline-block;
  padding: 0.6em 1.2em;
  background: #7f4600;
  color: #fff;
  border: 1px solid #000;
  border-radius: 3px;
  cursor: pointer;
  font-size: 1em;
  text-decoration: none;
  margin-right: 0.5em;
}

.btn:hover {
  background: #fff;
  color: #7f4600;
}

.btn-secondary {
  background: #666;
}

.btn-secondary:hover {
  background: #fff;
  color: #666;
}

/* Error message */
.error {
  color: #c00;
  background: #fee;
  padding: 0.5em 1em;
  border: 1px solid #c00;
  margin-bottom: 1em;
}

/* Download links (placeholder style) */
.download-link {
  color: #999;
  text-decoration: none;
  cursor: default;
}

/* Confirm table */
.confirm-table {
  width: 100%;
  max-width: 600px;
  border-collapse: collapse;
}

.confirm-table th,
.confirm-table td {
  padding: 0.5em;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid #ccc;
}

.confirm-table th {
  width: 120px;
  background: #f5f5f0;
}

/* License text */
.license-text {
  background: #fff;
  padding: 1em;
  border: 1px solid #ccc;
  max-height: 400px;
  overflow-y: auto;
  font-family: monospace;
  font-size: 0.9em;
  white-space: pre-wrap;
}
