/* typography.css: text styles, headings, and list conventions. */

/* Small helper text. */
.text-small {
    font-size:10pt;
}

/* Right-aligned text helper. */
.text-right {
    text-align:right;
}

/* Muted text color helper. */
.text-muted {
    color:#323232;
}

/* Bold emphasis helper. */
.text-strong {
    font-weight:bold;
}

/* Colored emphasis helpers used in info boxes. */
.text-strong-green {
    color:#06A17D;
}

.text-strong-pink {
    color:#000;
}

.text-strong-dark {
    color:#323232;
}

/* Image caption credit text. */
.caption-credit {
    font-size:70%;
}

/* Image caption body text. */
.caption-text {
    font-size:90%;
    padding-top:5px;
}

/* English caption variant. */
.caption-text-en {
    font-size:80%;
    padding:0;
}

/* English translations inline. */
span.en {
    opacity:0.7;
    font-size:90%;
}

/* English translation blocks. */
div.en {
    opacity:0.7;
    font-size:90%;
}

/* Spacing for English translation blocks inside info cards. */
.info div.en {
    padding-top:10px;
}

/* Global heading styles. */
h1 {
    font-size:18pt;
    font-weight:bold;
}

h2 {
    font-size:14pt;
    font-weight:bold;
    margin:0 0 20px 0;
    color:#323232;
    padding-bottom:5px;
    border-bottom:1px dotted #323232;
}

/* Compact heading variant without divider. */
.h2-compact {
    margin:-5px 0 0 0;
    padding:0;
    border:0;
}

/* Lists inside info cards. */
.info-container ul {
    list-style-type:none;
    list-style-position:outside;
    margin:0;
}

.info-container ul > li {
    margin-left:20px;
    margin-top:0;
}

.info-container ul > li + li {
    margin-top:10px;
}

/* Arrow list variant. */
.info-container ul.arrows {
    list-style:none;
    margin:0px 0;
}

.info-container ul.arrows li {
    position: relative;
    padding-left: 1.2em;
    margin:0px 0;
}

.info-container ul.arrows li::before {
  content: "\279C"; 
  position: absolute;
  left: 0;
  top: 0;
}

/* Italic emphasis. */
i {
    font-style:italic;
}

/* Bold emphasis. */
b {
    font-weight:bold;
}

/* Highlighted emphasis. */
em {
    font-weight:bold;
    color:#00BEFF;
}

/* Text link styling used in footer/info blocks. */
a.text:link, a.text:visited {
    color:inherit;
    text-decoration:none;
    border-bottom:1px dotted;
}

a.text:hover, a.text:active {
    color:inherit;
    text-decoration:none;
    border-bottom:1px solid;
}

span.wide {
    font-weight:bold;
    color:var(--color-cam-wide);
}

span.zoom {
    font-weight:bold;
    color:var(--color-cam-zoom);
}

span.ig {
    font-weight:bold;
    color:var(--color-cam-ig);
}

span.zg {
    font-weight:bold;
    color:var(--color-cam-zg);
}
