/* Coursera Design Guide — interaction and typography styles.
   Generated from the design source. Ships with the pages; do not merge into a
   global stylesheet and do not remove the !important flags: every element in
   these pages carries its own inline style, so unflagged rules would lose. */

/* --- Typography ---------------------------------------------------------
   Without the first three, Open Sans at 17px picks up noticeable weight and
   the page reads softer than the design even when every value matches. The
   fourth forbids the browser from synthesising a weight it does not have. */
html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-synthesis-weight: none;
}

/* Inline semantic tags also carry explicit inline styles in the markup; these
   are the backstop if a host reset neutralises them. */
strong, b { font-weight: 700; }
em, i { font-style: italic; }
strong em, em strong, strong i, b em { font-weight: 700; font-style: italic; }

/* Every p, li, ul, ol, heading and blockquote in the markup carries its own
   inline margin, so a zero base is safe here and blocks two failure modes at
   once: a browser default creeping in, and a host reset changing the rhythm.
   Inline styles win over this rule, so the design spacing is what renders. */
[data-print-page] :is(p, ul, ol, li, h1, h2, h3, h4, blockquote, figure, dl, dd, table, caption) {
  margin: 0;
  padding-inline-start: 0;
}


/* Data tables are real tables (caption + th scope) for screen readers. Cell
   padding, borders and widths all live inline, so only these structural bits
   belong here. */
[data-print-page] table { border-collapse: collapse; width: 100%; table-layout: fixed; }
[data-print-page] th { text-align: left; vertical-align: top; }
[data-print-page] :is(th, td) { box-sizing: border-box; }
[data-print-page] caption { text-align: left; }

/* --- Interaction -------------------------------------------------------- */
[data-if] { display: contents; }
[data-if][hidden] { display: none !important; }
[role="button"] { -webkit-tap-highlight-color: transparent; }
[role="button"]:focus:not(:focus-visible) { outline: none; }

.g1:hover {
  color: #8A5A0B !important;
}

.g2:hover {
  background: #FBFAF7 !important;
}

.g3:hover {
  background: #FBEFD9 !important;
}

.g4:hover {
  background: #FBFAF7 !important;
  color: #8A5A0B !important;
}

.g5:hover {
  text-decoration: underline !important;
}

.g6:hover {
  border-color: #00539B !important;
  box-shadow: 0 6px 20px rgba(1,33,105,.08) !important;
}

.g7:hover {
  background: #F2F6FB !important;
}

.g8:hover {
  background: #F0F6F2 !important;
}

.g9:focus-visible {
  outline: 2px solid #00539B !important;
  outline-offset: 3px !important;
}

.g10:hover {
  background: #E8F0F9 !important;
}

.g11:hover {
  border-color: #00539B !important;
}

.g12:hover {
  color: #1F2833 !important;
}

.g13:hover {
  background: #E6F0EA !important;
}

.g14:hover {
  border-color: #17724A !important;
}

.g15:hover {
  background: #F6F3FA !important;
}

.g16:hover {
  background: #EFE9F7 !important;
}

.g17:hover {
  border-color: #B4700C !important;
}

.g18:hover {
  border-color: #6B4E9E !important;
}

.g19:hover {
  background: #FDF6EC !important;
}

.g20:hover {
  background: #6B4A11 !important;
}

.g21:hover {
  border-color: #339898 !important;
  box-shadow: 0 6px 20px rgba(1,33,105,.08) !important;
}

.g22:hover {
  border-color: #C84E00 !important;
  box-shadow: 0 6px 20px rgba(1,33,105,.08) !important;
}

.g23:hover {
  border-color: #3A424E !important;
  box-shadow: 0 6px 20px rgba(1,33,105,.08) !important;
}

.g24:hover {
  background: #F8EBE2 !important;
}

.g25:focus-visible {
  outline: 2px solid #00539B !important;
  outline-offset: -2px !important;
}