2019-lightning-talk/style.css

   1 /* Red Hat red is rgb(238,0,0). */
   2
   3 body {
   4     background: url(redhat.png) no-repeat;
   5     background-position: 98% 6px;
   6     background-size: auto 48px;
   7     /* font-size: 28pt; */ /* For max */
   8     font-size: 20pt; /* For 1024x768 */
   9     font-family: Red Hat Text, liberation, helvetica;
  10     /* font-family: helvetica; */
  11
  12     /* Can be used to scale the whole document. */
  13     /*transform: translate(-10%,-10%) scale(0.75,0.75);*/
  14 }
  15
  16 body td, body th { /* why?? */
  17     font-size: 24pt;
  18     padding-bottom: 8px;
  19 }
  20
  21 h1 {
  22     color: rgb(238,0,0);
  23     /*font-size: 48px;*/
  24     font-size: 40px;
  25     top: 8;
  26     left: 0;
  27     border-bottom: 2px solid rgb(238,0,0);
  28 }
  29
  30 h2 {
  31     color: rgb(238,0,0);
  32     font-size: 32px;
  33     font-style: italic;
  34     border-bottom: 2px solid rgb(238,0,0);
  35 }
  36
  37 b {
  38     color: rgb(238,0,0);
  39 }
  40
  41 /* Title page. */
  42 div#titlepage {
  43     margin-top: 100px;
  44     width: 80%;
  45     margin-left: 10%;
  46 }
  47
  48 div#titlepage p.title {
  49     color: rgb(238,0,0);
  50     font-weight: bold;
  51     font-size: 48px;
  52     text-align: left;
  53 }
  54
  55 div#titlepage p.author {
  56     font-size: 36px;
  57     text-align: left;
  58 }
  59
  60 div#titlepage p.abstract {
  61     font-size: 28px;
  62     text-align: left;
  63 }
  64
  65 /* Code */
  66 pre.code {
  67     margin-left: 1em;
  68     background: #eee;
  69 }
  70
  71 code {
  72     color: rgb(238,0,0);
  73 }
  74
  75 /* Bullet points */
  76 li {
  77     padding-bottom: 16px;
  78 }
  79
  80 /* Plugins box. */
  81 div.plugins {
  82     background: #f8f8ff;
  83     border: 1px solid rgb(238,0,0);
  84     border-radius: 15px;
  85     margin-left: auto;
  86     margin-right: auto;
  87     width: 800px;
  88     height: 400px;
  89     /* Position relative is needed so that items may be
  90        positioned inside. */
  91     position: relative;
  92 }
  93
  94 div.plugins p#caption {
  95     position: absolute;
  96     bottom: -5px; right: 5px;
  97     color: rgb(238,0,0);
  98     text-align: right;
  99     font-size: 16px;
 100     font-weight: bold;
 101 }
 102
 103 div.plugins ul {
 104     position: absolute;
 105     top: 10%;
 106     width: 700px;
 107     height: 380px;
 108     column-count: 4;
 109     list-style-type: none;
 110     margin: 0;
 111 }
 112
 113 div.plugins ul li {
 114     padding: 0px;
 115     margin: 5px;
 116 }
 117
 118 div.plugins ul li.highlighted {
 119     border: 1px solid rgb(238,0,0);
 120     background: #fff;
 121     padding-left: 10px;
 122     color: rgb(238,0,0);
 123     border-radius: 20px;
 124     font-weight: bold;
 125 }
 126
 127 /* Filters box. */
 128 div.filters {
 129     background: #f8fff8;
 130     border: 1px solid rgb(238,0,0);
 131     border-radius: 15px;
 132     margin-left: auto;
 133     margin-right: auto;
 134     width: 800px;
 135     height: 280px;
 136     /* Position relative is needed so that items may be
 137        positioned inside. */
 138     position: relative;
 139 }
 140
 141 div.filters p.filtercaption {
 142     position: absolute;
 143     bottom: -5px; right: 5px;
 144     color: rgb(238,0,0);
 145     text-align: right;
 146     font-size: 16px;
 147     font-weight: bold;
 148 }
 149
 150 div.filters ul {
 151     position: absolute;
 152     top: 10%;
 153     width: 700px;
 154     height: 260px;
 155     column-count: 4;
 156     list-style-type: none;
 157     margin: 0;
 158 }
 159
 160 div.filters ul li {
 161     padding: 0px;
 162     margin: 5px;
 163 }
 164
 165 div.filters ul li.highlighted {
 166     border: 1px solid rgb(238,0,0);
 167     background: #fff;
 168     padding-left: 10px;
 169     color: rgb(238,0,0);
 170     border-radius: 20px;
 171     font-weight: bold;
 172 }
 173
 174 /* Colored highlighting */
 175 div.plugins ul li.bg_r,
 176 div.filters ul li.bg_r {
 177     background: #b00;
 178     color: white;
 179 }
 180
 181 div.plugins ul li.bg_g,
 182 div.filters ul li.bg_g {
 183     background: #0b0;
 184     color: white;
 185 }
 186
 187 div.plugins ul li.bg_b,
 188 div.filters ul li.bg_b {
 189     background: #00b;
 190     color: white;
 191 }
 192
 193 /* For images which must be centered on the page. */
 194 div.allcenter {
 195     display: flex;
 196     justify-content: center;
 197     align-items: center;
 198     height: 50vw;
 199 }
 200
 201 div.all-center img {
 202 }
 203
 204 /* Outlined text. */
 205 .outline {
 206     text-shadow: 2px 2px 0 rgb(238,0,0),
 207                  -2px 2px 0 rgb(238,0,0),
 208                  2px -2px 0 rgb(238,0,0),
 209                  -2px -2px 0 rgb(238,0,0),
 210                  0px 2px 0 rgb(238,0,0),
 211                  0px -2px 0 rgb(238,0,0),
 212                  -2px 0px 0 rgb(238,0,0),
 213                  2px 0px 0 rgb(238,0,0),
 214                  4px 4px 0 rgb(238,0,0),
 215                  -4px 4px 0 rgb(238,0,0),
 216                  4px -4px 0 rgb(238,0,0),
 217                  -4px -4px 0 rgb(238,0,0),
 218
 219                  0px 4px 0 rgb(238,0,0),
 220                  0px -4px 0 rgb(238,0,0),
 221                  -4px 0px 0 rgb(238,0,0),
 222                  4px 0px 0 rgb(238,0,0),
 223                  2px 4px 0 rgb(238,0,0),
 224                  -2px 4px 0 rgb(238,0,0),
 225                  2px -4px 0 rgb(238,0,0),
 226                  -2px -4px 0 rgb(238,0,0),
 227                  4px 2px 0 rgb(238,0,0),
 228                  -4px 2px 0 rgb(238,0,0),
 229                  4px -2px 0 rgb(238,0,0),
 230                  -4px -2px 0 rgb(238,0,0),
 231
 232                  4px 4px 0 rgb(255,128,128),
 233                  -4px 4px 0 rgb(255,128,128),
 234                  4px -4px 0 rgb(255,128,128),
 235                  -4px -4px 0 rgb(255,128,128),
 236                  0px 4px 0 rgb(255,128,128),
 237                  0px -4px 0 rgb(255,128,128),
 238                  -4px 0px 0 rgb(255,128,128),
 239                  4px 0px 0 rgb(255,128,128),
 240                  8px 8px 0 rgb(255,128,128),
 241                  -8px 8px 0 rgb(255,128,128),
 242                  8px -8px 0 rgb(255,128,128),
 243                  -8px -8px 0 rgb(255,128,128),
 244
 245                  0px 8px 0 rgb(255,128,128),
 246                  0px -8px 0 rgb(255,128,128),
 247                  -8px 0px 0 rgb(255,128,128),
 248                  8px 0px 0 rgb(255,128,128),
 249                  4px 8px 0 rgb(255,128,128),
 250                  -4px 8px 0 rgb(255,128,128),
 251                  4px -8px 0 rgb(255,128,128),
 252                  -4px -8px 0 rgb(255,128,128),
 253                  8px 4px 0 rgb(255,128,128),
 254                  -8px 4px 0 rgb(255,128,128),
 255                  8px -4px 0 rgb(255,128,128),
 256                  -8px -4px 0 rgb(255,128,128);
 257 }
 258
 259 /* Warning symbol. */
 260 span.warning {
 261     background-color: yellow;
 262     font-weight: bold;
 263 }
 264
 265 /* Attribution for artwork etc. */
 266 p.attribution {
 267     position: absolute;
 268     right: 10px;
 269     bottom: 10px;
 270     text-align: right;
 271     font-size: 10pt;
 272 }