@tailwind base;
@tailwind components;
@tailwind utilities;

@font-face {
  font-family: 'MD_Nichrome_Bold';
  src: url('../assets/fonts/MDNichrome-Bold.woff') format('woff');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'MD_Nichrome_Regular';
  src: url('../assets/fonts/MDNichrome-Regular.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

.blog-content h1,
.blog-content h2,
.blog-content h3,
.blog-content h4,
.blog-content h5,
.blog-content h6,
.blog-content strong,
.blog-content em {
  font-family: 'MD_Nichrome_Bold';
}

.blog-content h1,
.blog-content h2 {
  font-size: 1.5rem;
}

.blog-content img {
  border-radius: 1rem;
  margin-bottom: 1rem;
  margin-top: 1rem;
}

.blog-content h1 {
  margin-bottom: 1.5rem;
  margin-top: 1.5rem;
}

.blog-content hr {
  margin-bottom: 2rem;
  margin-top: 2rem;
}
.blog-content ul,
.blog-content ol {
  margin-bottom: 1rem;
  margin-top: 1rem;
  padding-left: 1.5rem;
  list-style-position: outside;
}

.blog-content li {
  margin-bottom: 0.5rem;
}

.blog-content ul {
  list-style-type: disc;
}

.blog-content ol {
  list-style-type: decimal;
}

.blog-content p {
  margin-bottom: 1rem;
  margin-top: 1rem;
}

@media (min-width: 916px) {
  .blog-content h1,
  .blog-content h2 {
    font-size: 2.6875rem;
  }
}