/* version: 0.18 */
/* Constants: Screen sizes; straight out off Bootstrap ************************/
/* Constants: Colors **********************************************************/
/* Constants: Rhythm and spacing **********************************************/
/* Constants: Typography ******************************************************/
/* Resets *********************************************************************/
html {
  font-size: 16px; }
  @media (min-width: 768px) {
    html {
      font-size: 18px; } }

body, header, footer, h1, h2, h3, h4, h5, h6, p, blockquote, li, ol {
  font-size: 100%;
  color: #303535;
  font-family: "Nunito Sans", Helvetica, Arial, sans-serif;
  font-weight: 300;
  line-height: 1.375; }

/* Pseudoclass; To be use only with @extend */
._topmargin, h1, h2, h3, h4, h5, h6, p, blockquote, ul, hr, img.cover, img.contributor, .panel, .well {
  margin: 1.375rem 0px 0px 0px; }

h1, h2, h3, h4, h5, h6, p, blockquote, ul, hr {
  padding: 0px; }

/* Tags: Paragraph styles *****************************************************/
#sitestack-footer-nav address {
  color: #F7F4ED; }

blockquote {
  background-color: #FAF6E6;
  border: 0px;
  padding: 1.375rem;
  padding-top: 1px;
  box-shadow: 5px 5px 2px 0px #e1e1e1; }

body {
  background-color: #ffffff; }

img.cover, img.contributor {
  padding: 1px;
  border: 1px solid #f1f1f1;
  width: 100%; }
  .featured img.cover, .featured img.contributor {
    margin-top: 0px;
    padding: 0px; }
  @media (min-width: 768px) {
    img.cover, img.contributor {
      border: 0px;
      box-shadow: 5px 5px 2px 0px #e1e1e1;
      padding: 0px; }
      .featured img.cover, .featured img.contributor {
        box-shadow: 5px 5px 2px 0px #333638;
        margin-top: 1.25rem; } }

h1 {
  letter-spacing: -0.0125em;
  font-weight: 900;
  font-size: 150%; }
  @media (min-width: 768px) {
    h1 {
      font-size: 218.06%;
      line-height: 1; }
      h1 span.subtitle {
        font-size: 75%; } }

h2 {
  font-style: italic;
  font-size: 125%; }
  @media (min-width: 768px) {
    h2 {
      font-size: 150%; } }

h3 {
  border-top: 1px solid #f1f1f1;
  color: #808080;
  font-size: 125%; }
  @media (min-width: 768px) {
    h3 {
      font-size: 150%; } }

h4, h5 {
  color: #4d4d4d;
  font-size: 88%;
  font-weight: 900;
  text-transform: uppercase; }

h4 {
  border-top: 1px solid #808080;
  padding-top: 2px;
  margin-top: 2.5rem; }

h5 {
  border-top-width: 0px;
  color: #808080; }

h6 {
  font-weight: 900; }

#sitestack-footer-nav hr {
  background-color: #F7F4ED;
  border-color: #F7F4ED; }

.sitestack-header li {
  color: #F7F4ED;
  margin-top: 8px;
  margin-left: 0.325rem;
  margin-right: 0.325rem;
  font-size: 90%; }
  .sitestack-header li.submenu-list-sep {
    text-align: center; }
#sitestack-header-nav li {
  font-size: 75%;
  font-weight: 700;
  text-transform: uppercase; }
#sitestack-header-nav-mobile li {
  color: #F7F4ED;
  border-bottom: 1px solid #F7F4ED;
  padding-top: 0.85rem;
  padding-bottom: 0.8rem; }
#sitestack-footer-nav li {
  font-weight: 300; }

p {
  hyphens: auto; }
  blockquote p {
    text-indent: -0.325em; }
  h3 + p {
    margin-top: 1rem; }
  h4 + p {
    margin-top: 0.25rem; }
  h5 + p {
    margin-top: 0.25rem; }
  h6 + p {
    margin-top: 0px; }
  p.btn-note {
    color: #808080;
    font-size: 75%;
    margin: 0.25rem 0px 0.75rem 0px; }
  p.featured-quote {
    text-indent: -0.44em;
    font-weight: 700; }
    @media (min-width: 768px) {
      p.featured-quote {
        font-weight: 900;
        font-size: x-large; } }
    @media (min-width: 992px) {
      p.featured-quote {
        font-size: xx-large; } }
    p.featured-quote:before {
      content: '\201C'; }
    p.featured-quote:after {
      content: '\201D'; }
  p.imprint {
    font-size: 76%;
    margin: 0px;
    text-transform: uppercase; }
    p.imprint.with-dark-bg strong {
      color: white; }
  p.nohyphenation {
    hyphens: none;
    -webkit-hyphens: none;
    -moz-hyphens: none;
    -ms-hyphens: none; }
  p.quote-source {
    margin-top: 0px;
    text-indent: -0.5rem; }
    p.quote-source:before {
      content: '\2014\2009'; }
  .featured-nav p {
    font-size: x-large; }
    .featured-nav p.with-dark-bg .featured-nav-button {
      color: #808080 !important;
      cursor: pointer; }
      .featured-nav p.with-dark-bg .featured-nav-button:hover {
        color: #F7F4ED !important; }
    .featured-nav p.with-dark-bg .selected {
      color: #F7F4ED !important;
      font-weight: 900; }
  .prizes p {
    color: white;
    font-weight: 700; }
  .well p {
    margin-top: 0px; }
  #sitestack-footer-nav p {
    color: #F7F4ED;
    font-weight: 300; }

ul.bullets {
  padding-left: 0px;
  text-indent: -9px;
  list-style: none; }
  ul.bullets li:before {
    content: '\0b7\020'; }
ul.list-inline {
  margin-top: 0px; }
@media (min-width: 768px) {
  ul.sitestack-footer-nav-menu {
    margin-top: 0px; } }
ul.sitestack-footer-nav-menu-top {
  margin-top: 0px; }
  @media (min-width: 768px) {
    ul.sitestack-footer-nav-menu-top {
      margin-top: inherit; } }
#toc ul {
  list-style: none; }
#sitestack-header-nav-mobile ul {
  margin-top: 0px; }

/* Tags: Character styles *****************************************************/
a {
  color: #387294; }
  h4 + a.btn {
    margin-top: 0.25rem; }
  .sitestack-header a {
    color: white;
    cursor: pointer;
    text-decoration: none; }
    .sitestack-header a:hover {
      color: white; }
  .with-dark-bg a {
    color: #F7F4ED !important;
    text-decoration: underline;
    text-decoration-style: dotted; }
  #sitestack-header-nav-mobile a, #sitestack-header-nav-browse a, #sitestack-header-nav-howto a, #sitestack-footer-nav a {
    color: #F7F4ED;
    text-decoration: none; }

b, strong {
  color: #4d4d4d;
  font-weight: 700; }

#sitestack-footer-nav strong {
  color: #F7F4ED; }

/* Classes ********************************************************************/
/* The following first classes are all related to vertical spacing. ***********/
.pagestack-section-with-bg {
  background-position: 50% 50%;
  padding-top: 2.75rem;
  padding-bottom: 4.125rem; }
  @media (min-width: 768px) {
    .pagestack-section-with-bg {
      padding-top: 4.125rem;
      padding-bottom: 5.5rem; } }

.push-above, .page-header {
  margin-top: 2.75rem; }
  @media (min-width: 768px) {
    .push-above, .page-header {
      margin-top: 4.125rem; } }

.push-below, .page-header {
  margin-bottom: 4.125rem; }
  @media (min-width: 768px) {
    .push-below, .page-header {
      margin-bottom: 5.5rem; } }

/* page-header, inherited from Bootstrap, redefined to match the 
   pagestack- system. The page-header pattern should be replaced
   by the pagestack-header system with the page-header row wrapped
   in the pagestack_header block.*/
.page-header {
  border-bottom-width: 0px;
  text-align: center; }

/* And now classes not related to vertical spacing ****************************/
.blocked {
  border-top: 1px solid #565656;
  border-bottom: 1px solid #565656;
  color: #565656;
  padding: 1.125rem 0.25rem 1rem 0.25rem;
  text-align: center;
  font-style: normal;
  font-size: smaller;
  margin-top: 5.5rem;
  text-transform: uppercase;
  font-weight: bold; }

.btn, .form-control {
  font-family: "Nunito Sans", Helvetica, Arial, sans-serif;
  font-size: 16px;
  font-weight: 300;
  /* Bootstrap thing? Somehow buttons may end up misaligned if line-height
     is kept the same as the line-height of text. */
  line-height: 1.25; }

.control-label {
  color: #565656; }
  @media (min-width: 768px) {
    .control-label {
      font-size: small; } }

.contrast-bg {
  background-color: #f1f1f1;
  border-top: 1px solid #dddddd;
  border-bottom: 1px solid #dddddd; }

.featured {
  background-color: #4b5457;
  background-image: url("/img/siskin/diagonal_feldgrau_bg.png"); }

.featured-nav {
  text-align: center; }

.fieldgreen {
  background-color: #4b5457; }

.flush {
  margin-top: 0px; }

/* Remove (default) top margin */
.has-error {
  border-color: red; }

.isbn {
  font-size: 88%;
  letter-spacing: 0.025em; }

.prizes {
  background-color: #92c83e;
  border-radius: 6px; }

.sitestack-header {
  background-color: #4b5457;
  border: 0px;
  border-radius: 0px;
  height: 61px;
  padding-top: 12px; }

.stick {
  margin-top: 0.25rem; }

/* Almost remove (default) top margin */
.submenu {
  display: none; }

.subtitle {
  font-style: italic; }

.title {
  font-size: 103%;
  font-weight: 900; }

.with-dark-bg {
  color: #F7F4ED !important; }

/* IDs ************************************************************************/
#pagestack-header {
  text-align: center; }

#sitestack-footer-nav {
  /* Footer; on every page. */
  background-color: #4b5457;
  background-image: url("/img/siskin/diagonal_feldgrau_bg.png");
  border-top: 7px solid #92c83e;
  padding-bottom: 4.125rem;
  padding-top: 2.75rem; }
  @media (min-width: 768px) {
    #sitestack-footer-nav {
      padding-bottom: 5.5rem;
      padding-top: 4.125rem; } }
  #sitestack-footer-nav .footer-logo {
    height: 37px;
    margin-bottom: 0.25rem;
    margin-top: 1rem; }
  #sitestack-footer-nav .footer-logo-ou {
    /* Compensating for OU's puny logo. */
    height: 41px;
    margin-top: 0.5rem; }
  #sitestack-footer-nav .menu-section-title {
    border-bottom: 1px solid #F7F4ED;
    color: #F7F4ED;
    font-size: 75%;
    font-weight: 700;
    text-transform: uppercase;
    padding-bottom: 0.0625rem; }
  #sitestack-footer-nav .sm-menu-icon {
    padding: 5px 10px 10px 0px; }

#sitestack-header-search {
  background-color: #f1f1f1;
  border-bottom: 1px solid #dddddd;
  height: 82px;
  padding-top: 24px; }

#sitestack-header-nav {
  background-color: #92c83e;
  border-bottom: 1px solid #8dc13c; }
  #sitestack-header-nav .header-button-right {
    display: block;
    padding: 9px 0px 0px 17px; }
  #sitestack-header-nav .header-button-left {
    display: block;
    padding: 9px 15px 0px 0px; }
  #sitestack-header-nav .header-logo {
    height: 37px; }
  #sitestack-header-nav .header-logo-list {
    margin-left: 0px;
    margin-top: 0px;
    margin-right: 1rem; }

#sitestack-header-nav-mobile {
  background-color: #4b5457;
  height: auto;
  padding-bottom: 1.75rem; }
  #sitestack-header-nav-mobile .submenu-list-sep {
    text-align: center;
    text-transform: uppercase;
    font-size: small; }