/**
 * SPDX-FileCopyrightText: 2017-2020 Jens Lechtenbörger
 *
 * SPDX-License-Identifier: GPL-3.0-or-later
 *
 * CSS for HTML index page.
 **/

@media (min-width: 38em) {
  html {
    font-size: 18px; }}

body {
  background: #fff;
  background-color: #fff;
  max-width: 28rem;
  margin-left: auto;
  margin-right: auto;
  line-height: 1.4;
  font-family: "Source Sans Pro", Helvetica, sans-serif;
  color: #222; }

@media (min-width: 38em) {
  body {
    max-width: 32rem; }}

@media (min-width: 56em) {
  body {
    max-width: 38rem; }}

h1 { margin: 1rem 0 .5rem 0; }
h2, h3 { margin: 1.5rem 0 .5rem 0; }
ul, ol { margin: 0.5rem 0 .5rem 0; }
p, li { margin: 0 0 .4rem 0; }

a {
  color: #00568a;
  text-decoration: none; }

a[href^="http"] { color: #107010; }
a[href^="https://oer.gitlab.io"] { color: #00568a; }

/* Show icon for outgoing/external link.
   Positioning without line break after icon based on this:
   https://stackoverflow.com/questions/16100956/prevent-after-element-from-wrapping-to-next-line
   Icon (drawn with mtPaint) released into Public Domain.
   Icon not shown for .nooutlink. */
a[href^="http"]:not(.nooutlink):after {
  content: "";
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAADAFBMVEUAAAD/AAAA/wD//wAAAP//AP8A///////b29u2traSkpJtbW1JSUkkJCTbAAC2AACSAABtAABJAAAkAAAA2wAAtgAAkgAAbQAASQAAJADb2wC2tgCSkgBtbQBJSQAkJAAAANsAALYAAJIAAG0AAEkAACTbANu2ALaSAJJtAG1JAEkkACQA29sAtrYAkpIAbW0ASUkAJCT/29vbtra2kpKSbW1tSUlJJCT/trbbkpK2bW2SSUltJCT/kpLbbW22SUmSJCT/bW3bSUm2JCT/SUnbJCT/JCTb/9u227aStpJtkm1JbUkkSSS2/7aS25Jttm1JkkkkbSSS/5Jt221JtkkkkiRt/21J20kktiRJ/0kk2yQk/yTb2/+2ttuSkrZtbZJJSW0kJEm2tv+SktttbbZJSZIkJG2Skv9tbdtJSbYkJJJtbf9JSdskJLZJSf8kJNskJP///9vb27a2tpKSkm1tbUlJSST//7bb25K2tm2SkkltbST//5Lb2222tkmSkiT//23b20m2tiT//0nb2yT//yT/2//bttu2kraSbZJtSW1JJEn/tv/bktu2bbaSSZJtJG3/kv/bbdu2SbaSJJL/bf/bSdu2JLb/Sf/bJNv/JP/b//+229uStrZtkpJJbW0kSUm2//+S29tttrZJkpIkbW2S//9t29tJtrYkkpJt//9J29sktrZJ//8k29sk////27bbtpK2km2SbUltSSRJJAD/tpLbkm22bUmSSSRtJAD/ttvbkra2bZKSSW1tJElJACT/krbbbZK2SW2SJEltACTbtv+2ktuSbbZtSZJJJG0kAEm2kv+SbdttSbZJJJIkAG222/+SttttkrZJbZIkSW0AJEmStv9tkttJbbYkSZIAJG22/9uS27ZttpJJkm0kbUkASSSS/7Zt25JJtm0kkkkAbSTb/7a225KStm1tkklJbSQkSQC2/5KS221ttklJkiQkbQD/tgDbkgC2bQCSSQD/ALbbAJK2AG2SAEkAtv8AktsAbbYASZIAAAAAAADPKgIEAAABAHRSTlP/////////AP//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////jbfv0AAAAF9JREFUGNNNj1ESADEEQ/2pCfe/7oaW5aMjr5lA9FVU+ZEGeGRAlpPIMSCbSE2bGOLXTBLq9kMLbJ3AY/1rQOKC62fT4PoX0AG+QObPlAxGgd7jDZ5N+cIS9C0O2CH4ABh/CXyet193AAAAAElFTkSuQmCC);
  background-size: 16px 16px;
  background-repeat: no-repeat;
  background-position: 50% 66%;
  margin: 0px 1px 0px 3px;
  padding-right: 16px; }

img {
  margin: 5px 0px 5px 0px;
  float: right; }

pre {
    border: 1px solid #ccc;
    box-shadow: none;
    overflow-x: auto;
    margin: 1em; }

code {
  color: dimgrey;
  background: whitesmoke;
  font-family: monospace; }

.title  { text-align: center; }

.status {
  margin: 1.5rem 0 0 0;
  font-size: 90%; }

div.figure, table {
  text-align: center;
  margin: 20px auto; }

div.figure img {
  max-width: 90%;
  float: none; }

table th {
  background-color: #a0a0a0;
  font-weight: bold; }

table tr:nth-child(odd) {
  background-color: whitesmoke; }

/* Display license of image rotated, in smaller font. */
div.figure p:nth-child(3) {
  opacity: 0.66;
  font-size: 0.8em;
  text-align: right;
  margin-left: auto;
  margin-right: 0;
  margin-top: -1em;
  line-height: 1.1;
  -webkit-transform: rotate(-90deg) translate(100%);
          transform: rotate(-90deg) translate(100%);
  -webkit-transform-origin: top right;
          transform-origin: top right; }
