/* god theme: Call me to include god in your SASS projects.*/

body > h1 {
  font-size: 300%;
}

body > h2 {
  font-size: 216.7%;
}

body > h3 {
  font-size: 166.7%;
}

body > h4 {
  font-size: 133.3%;
}

body > h5 {
  font-size: 116.7%;
}

body > h6 {
  font-size: 100%;
}

body > h1,
body > p,
body > menu,
body > footer,
body > ul {
  box-sizing: border-box;
  display: block;
  float: none;
  margin-block-end: 0;
  margin-block-start: 0;
  margin-left: 33% !important;
  margin-right: 33% !important;
  padding: 12px 3%;
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
  body > h1,
  body > p,
  body > menu,
  body > footer,
  body > ul {
    margin-block-end: 0;
    margin-block-start: 0;
    margin-left: 23.1% !important;
    margin-right: 23.1% !important;
  }
}

@media screen and (max-width: 768px) {
  body > h1,
  body > p,
  body > menu,
  body > footer,
  body > ul {
    margin-block-end: 0;
    margin-block-start: 0;
    margin-left: 12px !important;
    margin-right: 12px !important;
    padding: 3px;
  }
}

body > blockquote {
  box-sizing: border-box;
  display: inline-block;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding: 12px 3%;
  width: 30% !important;
  break-before: always !important; /* give way on right */
  clear: right;
  float: right;
  margin-left: 3% !important;
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
  body > blockquote {
    width: 39.3% !important;
  }
}

@media screen and (min-width: 1401px) {
  body > blockquote {
    width: 27.21% !important;
  }
}

body > aside {
  box-sizing: border-box;
  display: inline-block;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding: 12px 3%;
  width: 30% !important;
  clear: left;
  float: left;
  margin-right: 3% !important;
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
  body > aside {
    full: 9.3%;
    width: 39.3% !important;
  }
}

@media screen and (min-width: 1401px) {
  body > aside {
    full: 9.3%;
    width: 27.21% !important;
  }
}

@media screen and (max-width: 768px) {
  body > blockquote,
  body > aside {
    box-sizing: border-box;
    display: inline-block;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 12px 3%;
    width: 100% !important;
    display: block !important;
    float: none !important;
    text-align: left;
  }
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
  body > blockquote,
  body > aside {
    margin-bottom: 15.6px !important;
  }
}

@media screen and (min-width: 1025px) and (max-width: 1400px) {
  body > blockquote,
  body > aside {
    margin-bottom: 19.2px !important;
  }
}

@media screen and (min-width: 1401px) {
  body > blockquote,
  body > aside {
    margin-bottom: 22.8px !important;
  }
}

body > ol > li {
  margin-left: 12px !important;
}

body > ol > li > * {
  display: inline;
}

@media screen and (max-width: 1024px) {
  body > ol > li {
    list-style: inside;
  }
}

body > ul > li {
  margin-left: 12px !important;
}

body > ul > li > * {
  display: inline;
}

@media screen and (max-width: 1024px) {
  body > ul > li {
    list-style: inside;
  }
}

body > img {
  max-width: 34% !important;
}

.debug {
  background-color: #d3d3d3;
  color: #fff;
  display: none;
  font: 700 80% sans-serif;
  left: 0;
  margin: 0;
  padding: 3px;
  position: fixed;
  top: 0;
  visibility: hidden;
}

@media screen and (min-width: 1401px) {
  .debug.full {
    display: block;
    visibility: visible;
  }
}

@media screen and (min-width: 1025px) and (max-width: 1400px) {
  .debug.loose {
    display: block;
    visibility: visible;
  }
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
  .debug.cosy {
    display: block;
    visibility: visible;
  }
}

@media screen and (max-width: 768px) {
  .debug.tight {
    display: block;
    visibility: visible;
  }
}
/*# sourceMappingURL=god.css.map */
