static/css/main.css

   1 a {
   2   color: darkslategrey;
   3 }
   4 a:hover,
   5 a:active {
   6   color: #1f2f2f;
   7 }
   8 h1 {
   9   text-align: center;
  10   font-size: 1.66em;
  11 }
  12 h2 {
  13   text-decoration: underline;
  14   font-size: 1.33em;
  15 }
  16 ul.pagination {
  17   display: flex;
  18   justify-content: center;
  19 }
  20 ul.pagination > li {
  21   margin: 0 0.2em;
  22   display: inline;
  23 }
  24 body {
  25   margin: 0 0;
  26   display: flex;
  27   flex-flow: column nowrap;
  28   background-color: lightslategrey;
  29 }
  30 body > header {
  31   margin: 0;
  32   padding: 0.93rem 1% 0 1%;
  33   border-radius: 9.33rem 0 0 0;
  34   background-color: slategrey;
  35   display: flex;
  36   flex-flow: row wrap;
  37   align-items: start;
  38   justify-content: center;
  39 }
  40 body > header > figure {
  41   margin: 0;
  42   display: flex;
  43   width: 150px;
  44   height: 150px;
  45   border-radius: 90% 10% 1.3rem 1.3rem;
  46   background-color: darkslategrey;
  47   border: 1rem double slategrey;
  48 }
  49 body > header > figure > img {
  50   border-radius: 50% 3% 3% 3%;
  51 }
  52 body > header > nav {
  53   flex: 1 1 auto;
  54   text-align: center;
  55 }
  56 body > header > nav > header {
  57   font-size: 1.3rem;
  58   font-family: fantasy;
  59   color: slategrey;
  60   background-color: darkslategrey;
  61   border-radius: 1.3rem 1.3rem 0 0;
  62   border: 0.8rem double slategrey;
  63 }
  64 body > header > nav > nav {
  65   display: flex;
  66   justify-content: center;
  67   flex-flow: row wrap;
  68 }
  69 body > header > nav > footer {
  70   font-size: 1.1rem;
  71   font-family: fantasy;
  72   color: slategrey;
  73   background-color: darkslategrey;
  74   border-radius: 0 0 1.3rem 1.3rem;
  75   border: 0.8rem double slategrey;
  76 }
  77 body > header > nav svg {
  78   margin: 0 0;
  79   width: 3rem;
  80   height: 3rem;
  81   fill: darkslategrey;
  82 }
  83 body > header > nav a > summary {
  84   display: none;
  85 }
  86 body > header > nav a > svg:hover,
  87 body > header > nav a > svg:active,
  88 body > header > nav svg.selected {
  89   fill: #1f2f2f;
  90 }
  91
  92 body > main {
  93   margin: 0 0 0 0;
  94   padding: 0 2% 2% 2%;
  95   background-color: slategrey;
  96   font-size: 1.8rem;
  97   font-family: sans;
  98   color: #1f1f1f;
  99 }
 100 body > main > article {
 101   font-size: 0.8em;
 102   padding: 0 2% 2% 2%;
 103   border-radius: 1em 1em;
 104   background-color: lightslategrey;
 105   border-top: 1px solid black;
 106   border-bottom: 1px solid grey;
 107 }
 108 body > footer {
 109   font-size: 0.8rem;
 110   background-color: darkslategrey;
 111   height: 4rem;
 112   display: flex;
 113   flex-direction: column;
 114   text-align: center;
 115   justify-content: center;
 116   color: lightslategrey;
 117 }
 118