content/style.css

   1 /*
   2  * Nick's web site: default stylesheet
   3  *
   4  * Copyright © 2018 Nick Bowler
   5  *
   6  * This program is free software: you can redistribute it and/or modify
   7  * it under the terms of the GNU General Public License as published by
   8  * the Free Software Foundation, either version 3 of the License, or
   9  * (at your option) any later version.
  10  *
  11  * This program is distributed in the hope that it will be useful,
  12  * but WITHOUT ANY WARRANTY; without even the implied warranty of
  13  * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  14  * GNU General Public License for more details.
  15  *
  16  * You should have received a copy of the GNU General Public License
  17  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
  18  */
  19
  20 body {
  21     font-family: sans-serif;
  22     margin: 1em;
  23 }
  24
  25 h1 {
  26     font-size: 2em;
  27     max-width: 30em; /* 60rem */
  28 }
  29
  30 h2 {
  31     font-size: 1.5em;
  32     max-width: 40em; /* 60rem */
  33 }
  34
  35 a:link {
  36     color: mediumblue;
  37 }
  38
  39 a:active {
  40     color: red;
  41 }
  42
  43 a:visited {
  44     color: purple;
  45 }
  46
  47 p {
  48     text-align: justify;
  49     padding: 0;
  50     margin: 1em 0;
  51     max-width: 50em;
  52 }
  53
  54 ul, ol, dl {
  55     max-width: 50em;
  56     padding: 0;
  57     margin: 0;
  58 }
  59
  60 dt, dd, li {
  61     text-align: justify;
  62     margin: 0 0 0 2em;
  63     padding: 0;
  64 }
  65
  66 dl.terms>dt {
  67     display: list-item;
  68     font-weight: bold;
  69     text-align: left;
  70
  71     float: left;
  72 }
  73
  74 dt::after {
  75     content: " ";
  76 }
  77
  78 ul.ordered>li {
  79     list-style: none;
  80 }
  81
  82 ul.ordered>li>span:first-child, ul.ordered>li>*:first-child>span:first-child {
  83     display: inline-block;
  84     text-align: right;
  85
  86     margin-left: -1.8em;
  87     min-width: 1.8em;
  88 }
  89
  90 hr {
  91     text-align: left;
  92     margin: 0.5em 0;
  93     width: 50em;
  94     border: 0;
  95     border-top: 1px solid lightgray;
  96 }
  97
  98 small.permalink {
  99     font-size: small;
 100     color: slategray;
 101 }
 102 .permalink a:link, .permalink a:visited {
 103     color: slategray;
 104 }
 105
 106 @media not screen {
 107     small.permalink {
 108         visibility: hidden;
 109     }
 110 }
 111
 112 #footer {
 113     max-width: 44em;
 114     margin: 0;
 115     padding: 0 3em;
 116     text-align: center;
 117 }
 118
 119 #footer>p {
 120     display: inline-block;
 121     color: slategray;
 122     font-size: 0.8em;
 123     max-width: 100%;
 124     margin: 0.2em 0;
 125 }
 126
 127 @media (max-width: 512px) {
 128     li, dd, dt, p, #footer>p { text-align: left; }
 129 }