@import "dynamic-styles.css";

strong,
b {
  font-weight: bold !important;
  -webkit-font-smoothing: antialiased;
}

.mce-content-body,
.editor-content {
  color: var(--primary-font-colour);
  font-family: "primaryFontFace";
  font-size: var(--primary-font-size);
  font-weight: var(--primary-font-weight);
  line-height: 1.8;
}

.mce-content-body h1,
.editor-content h1 {
  color: var(--h1-font-colour);
  font-family: "h1FontFace";
  font-size: var(--h1-font-size);
  font-weight: var(--h1-font-weight);
}

.mce-content-body h2,
.editor-content h2 {
  color: var(--h2-font-colour);
  font-family: "h2FontFace";
  font-size: var(--h2-font-size);
  font-weight: var(--h2-font-weight);
}

.mce-content-body h3,
.editor-content h3 {
  color: var(--h3-font-colour);
  font-family: "h3FontFace";
  font-size: var(--h3-font-size);
  font-weight: var(--h3-font-weight);
}

.mce-content-body h4,
.editor-content h4 {
  color: var(--h4-font-colour);
  font-family: "h4FontFace";
  font-size: var(--h4-font-size);
  font-weight: var(--h4-font-weight);
}

.mce-content-body h5,
.editor-content h5 {
  color: var(--h5-font-colour);
  font-family: "h5FontFace";
  font-size: var(--h5-font-size);
  font-weight: var(--h5-font-weight);
}

.mce-content-body h6,
.editor-content h6 {
  color: var(--h6-font-colour);
  font-family: "h6FontFace";
  font-size: var(--h6-font-size);
  font-weight: var(--h6-font-weight);
}

.mce-content-body p,
.editor-content p {
  color: var(--p-font-colour);
  font-family: "paragraphFontFace";
  font-size: var(--p-font-size);
  font-weight: var(--p-font-weight);
}

.mce-content-body table td,
.editor-content table td {
  vertical-align: top;
}

.mce-content-body table td p,
.editor-content table td p {
  margin: 0;
}

@media (max-width: 768px) {
  .mce-content-body table,
  .editor-content table {
    width: 100%;
  }

  .mce-content-body table colgroup,
  .editor-content table colgroup {
    display: none;
  }

  .mce-content-body table td,
  .editor-content table td {
    display: block;
    width: 100%;
  }

  .mce-content-body table tr,
  .editor-content table tr {
    display: block;
  }

  .mce-content-body table tr td:first-child,
  .editor-content table tr td:first-child {
    margin-bottom: 20px;
  }
}