/**
 * Base Typography
 * Headings, links, and content typography.
 */

/* Headings */
h1 {
  font-size: 2em;
  margin: .67em 0;
  clear: both;
  font-weight: var(--global-font-weight);
}

h2, h3, h4, h5, h6 {
  font-weight: var(--global-font-weight);
}

/* Sub/Sup */
sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
  font-weight: var(--global-font-weight);
}

sub {
  bottom: -.25em;
}

sup {
  top: -.5em;
}

/* Links */
a {
  background-color: transparent;
  text-decoration: none;
  color: var(--theme-skin, #505050);
  outline: 0;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  word-break: break-word;
}

a:hover, a:active, a:focus {
  transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
}

a:hover {
  color: var(--theme-skin-matching, #505050);
}

/* Preformatted text & Code */
pre {
  overflow: auto;
  font-family: 'Fira Code', 'Noto Sans SC', monospace;
  font-size: 14px;
  line-height: 1.6;
  word-wrap: break-word;
  white-space: pre-wrap;
  word-break: break-all;
}

pre code {
  background: transparent;
  padding: 0;
}

code {
  font-family: 'Fira Code', 'Noto Sans SC', monospace;
}

/* Blockquote */
blockquote {
  position: relative;
  margin: 16px 0;
  padding: 5px 8px 3px 30px;
  background: none;
  border: none;
  font-style: normal;
  line-height: 1.6;
  word-wrap: break-word;
}

blockquote:before {
  content: '\f10d';
  font-family: 'FontAwesome';
  font-size: 24px;
  position: absolute;
  top: 3px;
  left: 3px;
  color: var(--theme-skin-matching, #a4cdf6);
}

blockquote:after {
  content: '\f10e';
  font-family: 'FontAwesome';
  font-size: 24px;
  position: absolute;
  bottom: 3px;
  right: 3px;
  color: var(--theme-skin-matching, #a4cdf6);
}

.wp-block-quote {
  margin: 16px 0;
}