@import url('.../font/css');

html {
/*
  background-image: url("http://odin.himinbi.org/gallery/download/9942-1/orange_thatch_faded.jpg");
*/
  background-color: #E6DCCF;
  color: rgb(55, 0, 49);
  text-align: justify;
  font-size: 13pt;
  padding: 0 0.25in;
}

title:hover {
    color: rgba(200,100,100,.3);
}

section section title:hover {
    color: rgba(100,200,100,.3);
}


body {
  max-width: 42em;
  margin: 0 auto;
  background-color: #F7F2E9;
  padding: 2em 1em;
  border: 2px solid #4D3818;
  border-style: none solid;
  
}

@media print {
  html { background-image: none; background-color: transparent; }
}

.outset { text-indent: -.5em; margin-left: .5em; }
p { text-indent: 1em; }

a                { text-decoration: none; }
a:link, a:active { color: #271A6E; }
a:visited        { color: #26349E; }
a:hover, a:focus { color: #1E825D; }

h1, h2, h3 { text-align: center; }

th, td { text-align: center; }

.signature:before { content: '\2014\2007'; }
.signature { margin-left: 60%; }
.signature + .signature { margin-bottom: 0; margin-top: 0; padding: 0 }

.break-before { page-break-before: always }
.break-after { page-break-after: always }

.small-caps { font-variant: small-caps }
.uppercase { text-transform: uppercase }
.italic { font-style: italic }
.bold { font-weight: bold }
.monospace { font-family: monospace }
.normal { font-variant: normal; font-weight: normal; font-style: normal; }

i i, em i, i em, i cite { font-style: normal; }

.bold { font-weight: bold }
.italic { font-style: italic }

.noindent, div.noindent > * { text-indent: 0 }

wbr:after { content: '\200B' }

[class='hidden'] { visibility: hidden; }
.visible { visibility: visible; }

rect[purpose='outline'] {
    stroke: red;
    stroke-width: 1;
    fill: none;
}

message {
    font-size: 110%;
    display: block;
    border: 2px solid;
    border-radius: .5em;
    padding: .25em .5em;
    margin: 1em 5em;
}

* { -webkit-transition : all .25s linear; }

a:hover { text-decoration: none; color: red; border-bottom: 1px dashed #DDD; }
a:active { text-decoration: none; color: orange; border-bottom: 1px dashed #DDD; }

message:hover {
    border-color: transparent;
    background-color: #E6DCCF;
}

message [role='icon'] {
    width : 3em;
    float : left;
}

object[role='icon'] {
    height : 3em;
}

title { margin: 0 }

body title, body subtitle, body author { display : block }
section > title, section > author {
    text-align: center;
    font-weight: bold; font-family: Bellerose;
    margin: 0;
    padding: 0;
}
section > title + title {
    font-style: italic;
    font-size: 22pt;
}

section > title                     { font-size: 30pt }
section > author,
section > section > title           { font-size: 26pt }
section > section > author,
section > section > section > title { font-size: 22pt }

/* Doesn't look right in Chrome */
section > title { line-height: 1.5em }

author:before { content: 'by: ' }

h2 { font-family: 'Fago No Bold' }

[func='ideogram'] {
    display : inline;
    width: 1em;
    height: 1em;
}

[func='ideogram']:hover {
    opacity: .75;
    background-color: yellow;
    background-opacity: .5;
}

[func='row'] {
    display: block;
    max-width: 100%;
    margin: auto;
}