* {
  font-family: Arial;
  color:#333;
  line-height: 1.5em;
}
body{background-color: #f8f8f8;margin: 16px 32px;}
.layout-default h1 img{
  /* centered */
  margin: 0 auto;
  display: block;
}
h1 img{
  margin-left: -33px; /* make up for whitespace in image */
  max-width: 100%;
}
.encore{font-size: 60%;}
a{color:#338;}
a:hover{text-decoration: underline;color:#33f;}
a:visited{color:#333;}
h2 * {
  /* font-awesome things */
  background-color: #823331;
  color: #f8f8f8;
  margin-right: 0.15em;
}
h2{
  background-color: #823331;
  color: #f8f8f8;
  padding: 0.5em 16px;
  margin: 1.5em -16px;
}

table {
    border: 1px solid #666;
    border-collapse: collapse;
}

table.tableList, table.tableList td {
    border-style: none;
    padding-left: 0;
}

th.references {
    font-style: italic
}

th {
    background: #eee;
    text-align: left;
}

th, td {
    padding: 0.2em;
    border: 1px solid #666;
}

.filters {
    margin-bottom: 1em;
}

.filters thead th {
    background: #ccc;
}

.null {
    color: #999;
}

#table-diagram {
    height: 5em; /* initial height, will be altered in js when diagram rendered */
    margin: 1em 0;
    border: 1px solid #333;
    padding: 1em;
}

a.button {
  padding: 1em;
  background-color: #4CAF50;
  color: #fff;
  text-decoration: none;
  font-weight: bold;
  display: block;
  width: 13em;
  margin: 1em auto;
  white-space: nowrap;
  text-align: center;
}
#container{
  max-width: 58em;
  margin: 0 auto;
}
blockquote {
  font-size: 1.25em;
  background-color: #eee;
  padding: 1em;
  margin: 1em 0;
  quotes: "\201C""\201D""\2018""\2019";
  position: relative;
}
blockquote .attribution {
  font-size: 0.5em;
  color: #823331;
  display: block;
  text-align: right;
  margin-top: 0.5em;
}
blockquote .quote:before {
  content: open-quote;
  position: absolute;
  top: 0.25em;
  left: 0.25em;
  font-size: 2em;
}
iframe {
  /*youtube vid*/
  max-width: 100%;
}
.headline {
  font-size: 1.3em;
  text-align: center;
  margin: 0 0 1em 0;
}
.live-demo {
  margin-top: 3em;
}
code{
  font-family: monospace;
}
.screenshots{
  overflow: auto; /* clearfix */
}
.screenshot-block{
  float: left;
  margin-right: 2em;
}
h3 {
  margin: 1em 0 0.25em 0;
}
h4 {
  margin: 0.5em 0 0.25em 0;
}