2019-fosdem/style.css

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