/*
  The color of the interior of the incandescant bulb shown
  in the logo of pallor is #fff8eb (probably the same in
  both logos).
  Our orange is #c96c1c.
  Our dark blue is #2b3e4f (from the disk around the bulb
  in the dark logo).
*/

@import url('https://fonts.googleapis.com/css2?family=Dawning+of+a+New+Day&family=Source+Code+Pro:wght@500;600;700&display=swap');

/* Intermediary queries. */

/* Intermediary queries for the banner. */

/* Overridden if the next intermediary query matches. */
  .banner.of_darkness {font-size: 5vw} /* see note 1 */
/**/
@media (min-device-width: 561px) and (min-width: 561px) {
  .banner.of_darkness {font-size: 31px} /* see note 1 */
  .main-body {
    width: 5.5in;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
  html {
    /* background-color: #bcc; */
  }
  .banner {
    margin-left: auto;
    margin-right: auto;
    width: 17.5em;
    max-width: 100%;
    text-align: center;
  }
}

/*
  Intermediary queries for the standard group of buttons.
*/
  .std-buttons {
    font-size: 12vw;
  }
  .std-buttons > * {
    margin-top: .5em;
    display: block;
    margin-left: auto; margin-right: auto;
  }
  .main-body          {font-size: 3vw}
@media (min-device-width: 481px) and (min-width: 481px) {
  .main-body          {font-size: 1em}
  body           {padding-bottom: 3em}
  .std-buttons {
    margin-top: 5mm;
    margin-bottom: 3.5mm;
    display: grid;
    grid-template-columns: auto auto auto;
    justify-content: space-between;
    font-size: 20px;
    margin-left: auto;
    margin-right: auto;
    width: 5.5in; /* matches that of .main-body */
    max-width: 100%;
  }
}
/* End of intermediary queries. */

body {
  margin-left: 0; margin-right: 0;
  margin-top: 0;
}
.std-buttons button,
.std-buttons .button {
  text-decoration: none;
  z-index: 8;
  text-align: center;
  width: 7.75em;
  font-size: .95em;
  border-radius: .2em;
  height: 1.5em;
  background-color: #c96c1c;
  border: none;
  font-family: 'Source Code Pro';
  font-weight: bold;
  color: #fff5e3;
}

body {
  background-color: white;
  font-family: 'Source Code Pro';
  font-weight: 600;
  color: #2b3e4f;
  text-align: justify;
}

.banner {
  text-align: center;
  display: block;
}
.banner > * {
  display: inline-block;
  vertical-align: middle;
}
.banner-wrapper.of_darkness {
  background-color: #2b3e4f;
}
.banner.of_darkness .science {
  color: #f2e7c9;
}
.banner.of_pallor .science {
  color: #2b3e4f;
}
.banner .forum {
  /* Voting Theory Forum */
  line-height: .85;
  text-align: left;
  font-family: 'Source Code Pro';
  font-weight: bold;
  color: #c96c1c;
  margin-bottom: 0;
  padding-bottom: 0
}
.banner .science {
  /* the science of collective decisions */
  line-height: .9;
  text-align: center;
  font-family: 'Dawning of a New Day';
  font-weight: 600;
  margin-top: 0;
  padding-top: 0;
  padding-bottom: 0;
}

.banner.of_darkness {
  padding-top: 0.4em; padding-bottom: 0.4em;
}
.banner img.logo {
  padding-right: 0.18000000000000002em;
  padding-bottom: 0.4em;
  padding-top: 0.2em;
  height:   2.8000000000000003em;
  width:    auto;
}
.banner .forum {
  font-size: 1.25em;
}
.banner .science {
  font-size: 1.07em;
}

.heartbeep .twiddle {color: #aae}

/* For the "not found" page. */
.ludicrous, .huge {text-align: center}
.ludicrous {
  overflow: hidden;
  margin: 0;
  font-size: 16.5em;
  line-height: .8;
}
.huge {
  margin: 0;
  font-size: 2.53em;
}

.archive-header h1 {display: inline}
.archive-header>div {clear: both}
.archive-header a {float: right}
.category, .topic {
  border-top:    1px solid #c96c1c;
  border-bottom: 1px solid #c96c1c;
  padding-top: .5em;
  padding-bottom: .5em;
  display: block
}
.category>p, .topic>p {
  padding-top: 0;
  padding-bottom: 0;
  margin-top: 0;
  margin-bottom: 0;
}
.category>p>span.label, .topic>p>span.label {
  color: #c96c1c;
}

.inverted { /* not that happy with this scheme. */
  background-color: #2b3e4f;
  color: white;
  padding-left: .15em;
  padding-right: .15em
}
.inverted :link    {color: #c96c1c}
.inverted :visited {color: #fff8eb}

.post-head {
  border: 1px solid #c96c1c;
  padding: .2em;
}
.post-body {
  margin-bottom: 3em;
}
.search-type label {
  display: block;
  text-align: right
}
label p {
  margin-bottom: 0
}
select.search-type, option {
  margin: .5em;
  background-color: #c96c1c;
  color: white;
  font-family: 'Source Code Pro';
  font-size: 19px;
  padding-bottom: 3px;
}
select.search-type.chosen {
  background-color: white;
  color: #2b3e4f
}
.search-spec {
  padding-bottom: .5em;
  padding-left:   .5em
}
.search-compound-grid {
  display: grid;
  grid-template-columns: 1em auto;
  grid-column-gap: 0;
  padding: .2em;
}
.search-compound-right>div {
  border: 1px solid #c96c1c;
}
.status.err, .warning {
  color: #c96c1c
}

#main-body h1,
#main-body h2,
#main-body h3,
#main-body h4,
#main-body h5,
#main-body h6 {text-align: left}

.readable-text, .post-head {
  font-family: sans;
  font-weight: normal;
  text-align: left
}


/* Notes
[1] These font-size settings are not the font size in which
  the browser shall render any text. Instead, we use these
  settings to control the overall size of ensembles of
  components whose proportions relative to each other we
  hold constant. An example is the banner at the top, and
  another is the standard group of three buttons. The
  components are sized in "em".
*/
