body,
td,
th {
  font-family: "Lato", sans-serif;
  font-size: 12pt;
  padding: 0;
  margin: 0;
  color: #333333;
  background-color: #fff;
}
body {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  -ms-flex-direction: column;
      flex-direction: column;
  -ms-flex-pack: center;
      justify-content: center;
  -ms-flex-align: center;
      align-items: center;
  min-height: 100vh;
  margin: 0;
  padding: 0;
}
#wrap {
  padding: 20px 25px;
  max-width: 900px;
  -ms-flex: 1;
      flex: 1;
}
#header {
  padding: 10px 25px;
  border-top: 20px solid #d23535;
  border-bottom: 2px solid #eeeeee;
  overflow: auto;
  text-align: center;
  min-width: 100%;
  box-sizing: border-box;
}
#header h1 {
  margin: 0;
}
#header .social {
  margin: 10px;
  min-height: 25px;
}
#footer {
  text-align: center;
  padding: 20px;
  background-color: #f6f6f6;
  color: #999999;
  font-size: 90%;
  min-width: 100%;
  box-sizing: border-box;
}
#footer a {
  color: #999999;
}
h1,
h2,
h3 {
  font-family: "Cormorant Infant", serif;
  font-weight: 700;
  text-transform: uppercase;
}
h1 {
  font-size: 200%;
}
h2 {
  font-size: 180%;
}
h3 {
  font-size: 150%;
}
table {
  border: collapse;
}
td {
  padding: 5px;
}
a {
  color: #d23535;
}
a:visited {
  color: #777;
}
img {
  border: 0;
}
.tagline {
  font-size: 1.2em;
  line-height: 1.5em;
  margin: 0 0 20px 0;
}
.clear {
  clear: both;
}
.bold {
  font-weight: bold;
}
.small {
  font-size: 85%;
}
.tiny {
  font-size: 75%;
}
.floatright {
  float: right;
}
.floatleft {
  float: left;
}
.alignleft {
  text-align: left;
}
.alignright {
  text-align: right;
}
.aligncenter,
.center {
  text-align: center;
}
.error {
  font-size: 120%;
  margin: 0 0 20px 0;
}
.indent {
  margin-left: 1em;
}
.input {
  border: 1px solid #ccc;
  padding: 3px;
  background-color: #fff;
}
/* Art of War */
.chapterheading {
  color: #000;
  font-size: 200%;
  margin: 0 0 20px 0;
}
.verseheading {
  color: #aaa;
  font-size: 150%;
}
.bodytext {
  float: left;
  width: 400px;
  margin: 0 50px 25px 0;
  font-size: 125%;
  line-height: 1.75em;
}
@media screen and (max-width: 950px) {
  .bodytext {
    float: none;
    width: auto;
    margin: 0 0 25px 0;
  }
}
.bodytext a {
  text-decoration: none;
  border-bottom: 1px dotted #ccc;
  color: #333333;
}
.bodytext a:hover {
  text-decoration: none;
  border-bottom: 1px solid #d23535;
  color: #d23535;
}
.commentary {
  float: left;
  max-width: 400px;
  margin: 0 0 25px 0;
  font-style: italic;
  color: #777;
}
@media screen and (max-width: 950px) {
  .commentary {
    float: none;
    font-size: 125%;
    max-width: none;
  }
}
a.permalink {
  font-size: 0.75em;
  text-decoration: none;
  text-align: center;
  color: #777;
  border: 1px solid #ccc;
  background-color: #eeeeee;
  text-shadow: 1px 1px #fff;
  padding: 2px 4px 2px 4px;
  border-radius: 5px;
}
a.permalink:hover {
  color: #777;
  text-decoration: none;
  border: 1px solid #ccc;
}
.datanav {
  /*text-align: center;*/
  margin: 0px 0 30px 0;
  line-height: 2em;
}
#toc {
  float: left;
  width: 250px;
  line-height: 1.5em;
}
#menu {
  float: left;
  width: 250px;
  line-height: 1.5em;
}
#menu ul {
  list-style: none;
  margin-left: 0;
  padding-left: 0;
}
#passagesnippet {
  padding: 20px 0 20px 0;
}
#passagesnippet input {
  width: 350px;
}
.searchform {
  margin-top: 20px;
}
.searchresults {
  margin: 10px 0 10px 0;
  font-size: 125%;
  line-height: 1.75em;
}
.searchresult {
  padding: 0 0 10px 0;
}
.cloud {
  line-height: 2em;
  text-align: center;
}
.cloud a {
  padding: 0 5px 0 5px;
  text-decoration: none;
}
.download {
  float: left;
  width: 50%;
  line-height: 1.5em;
}
.download form input[type="submit"] {
  border: 1px solid #d23535;
  padding: 5px 20px;
  font-size: 120%;
  font-weight: bold;
  color: #d23535;
  background-color: transparent;
  text-decoration: none;
}
.download form input[type="submit"]:hover {
  color: #fff;
  background-color: #d23535;
}
.download-ad {
  margin: 10px 0 30px 0;
  min-width: 336px;
}
.thermometer {
  padding: 0 0 20px 0;
}
.comment {
  margin: 5px 0 20px 0;
  padding: 5px 0 20px 0;
  border-bottom: 1px dashed #eeeeee;
  max-width: 400px;
}
.commentauthor {
  font-weight: bold;
  font-size: 110%;
}
.commentdate {
  font-size: 75%;
  color: #999;
}
.commentform .input {
  max-width: 400px;
}
#commenterror,
#commentsuccess {
  margin: 10px 0 10px 0;
  padding: 10px;
  font-size: 120%;
  text-align: center;
  max-width: 380px;
}
#commenterror {
  border: 2px solid #d23535;
  background-color: #fee;
  color: #900;
}
#commentsuccess {
  border: 2px solid #0e0;
  background-color: #efe;
  color: #090;
}
.information {
  max-width: 600px;
  line-height: 1.5em;
}
.information p {
  margin: 0 0 10px 0;
}
/* Ads */
#homepagead {
  float: right;
  margin: 25px 20px;
  min-width: 336px;
}
@media screen and (max-width: 760px) {
  #homepagead {
    float: none;
    margin-left: 0;
  }
}
#headerad {
  margin: 20px 0 10px 0;
}
#footerad {
  margin: 50px 0 0 0;
}
#commentsad {
  position: absolute;
  margin-left: 500px;
}
#disqus_thread {
  max-width: 400px;
}
@media screen and (max-width: 950px) {
  #disqus_thread {
    max-width: none;
  }
}
#cloudad {
  float: right;
  margin: 0 0 10px 10px;
  padding: 5px;
  border: 1px solid #d23535;
}
