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

/*
 * TODO: Make translations folder for these styles.
 */
@layer components {
  #chapter_card {
    li {
      @apply text-2xl mt-5 mb-2 font-extrabold;
    }

    #footnotes > li {
      @apply list-inside text-sm font-light;
    }

    hr {
      @apply mb-6;
    }

    h2 {
      @apply text-lg my-4 underline font-bold;
    }

    p {
      @apply indent-6;
    }

    blockquote > p {
      @apply indent-0;
    }

    a {
      @apply text-sky-700;
    }
  }

  .card_title_style {
    @apply text-gray-900 text-4xl my-4 mx-auto text-center;
  }
}
/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *


 */

body {
  background-color: rgb(247, 247, 247);
}