EarlyBlue/global/aboutReader.css

   1 /* This Source Code Form is subject to the terms of the Mozilla Public
   2  * License, v. 2.0. If a copy of the MPL was not distributed with this file,
   3  * You can obtain one at http://mozilla.org/MPL/2.0/. */
   4
   5 body {
   6   padding: 64px 0;
   7 }
   8
   9 @media (max-width: 785px) {
  10   body {
  11     padding-top: 64px;
  12     -moz-padding-end: 0;
  13     padding-bottom: 64px;
  14     -moz-padding-start: 51px;
  15   }
  16 }
  17
  18 body.loaded {
  19   transition: color 0.4s, background-color 0.4s;
  20 }
  21
  22 body.light {
  23   color: #333333;
  24   background-color: #ffffff;
  25 }
  26
  27 body.dark {
  28   color: #eeeeee;
  29   background-color: #333333;
  30 }
  31
  32 body.dark *::-moz-selection {
  33   background-color: #FFFFFF;
  34   color: #0095DD;
  35 }
  36 body.dark a::-moz-selection {
  37   color: #DD4800;
  38 }
  39
  40 body.sepia {
  41   color: #5b4636;
  42   background-color: #f4ecd8;
  43 }
  44
  45 body.sans-serif,
  46 body.sans-serif .remove-button {
  47   font-family: Helvetica, Arial, sans-serif;
  48 }
  49
  50 body.serif,
  51 body.serif .remove-button  {
  52   font-family: Georgia, "Times New Roman", serif;
  53 }
  54
  55 #container {
  56   max-width: 30em;
  57   margin: 0 auto;
  58 }
  59
  60 #container.font-size1 {
  61   font-size: 12px;
  62 }
  63
  64 #container.font-size2 {
  65   font-size: 14px;
  66 }
  67
  68 #container.font-size3 {
  69   font-size: 16px;
  70 }
  71
  72 #container.font-size4  {
  73   font-size: 18px;
  74 }
  75
  76 #container.font-size5 {
  77   font-size: 20px;
  78 }
  79
  80 #container.font-size6 {
  81   font-size: 22px;
  82 }
  83
  84 #container.font-size7 {
  85   font-size: 24px;
  86 }
  87
  88 #container.font-size8 {
  89   font-size: 26px;
  90 }
  91
  92 #container.font-size9 {
  93   font-size: 28px;
  94 }
  95
  96 /* Override some controls and content styles based on color scheme */
  97
  98 body.light > .container > .header > .domain {
  99   border-bottom-color: #333333 !important;
 100 }
 101
 102 body.sepia > .container > .header > .domain {
 103   border-bottom-color: #5b4636 !important;
 104 }
 105
 106 body.dark > .container > .header > .domain {
 107   border-bottom-color: #eeeeee !important;
 108 }
 109
 110 body.sepia > .container > .footer {
 111   background-color: #dedad4 !important;
 112 }
 113
 114 body.light blockquote {
 115   -moz-border-start: 2px solid #333333 !important;
 116 }
 117
 118 body.sepia blockquote {
 119   -moz-border-start: 2px solid #5b4636 !important;
 120 }
 121
 122 body.dark blockquote {
 123   -moz-border-start: 2px solid #eeeeee !important;
 124 }