themes/uPsay.css

   1 @import url(https://fonts.googleapis.com/css?family=Armata&subset=latin,latin-ext);
   2 @import url(https://fonts.googleapis.com/css?family=Inconsolata:400,700&subset=latin,latin-ext);
   3 @import url("cm.css");
   4
   5 /**** structure of the slide in this theme:
   6       no-header
   7       title : 10%
   8       text : 80% == 20 lines of text.
   9       footer :10%
  10
  11
  12
  13 */
  14
  15
  16 /* No header in this theme */
  17 .sws-header {
  18     display: none;
  19 }
  20
  21 .sws-title > h1 {
  22     margin:0;
  23     padding:0;
  24 }
  25 .sws-title {
  26     box-sizing:border-box;
  27 }
  28 .sws-cover {
  29     display:flex;
  30     flex-direction:column;
  31     justify-content: center;
  32     background:#00537f;
  33     height: 3em;
  34     padding: 0;
  35     margin: 0;
  36 }
  37
  38 .sws-cover .sws-content {
  39     text-align:left;
  40     background-color:#003a58;
  41     background-image: url(reserve_upsay.svg);
  42     background-size:auto  100%;
  43     background-position: right top;
  44     background-repeat: no-repeat;
  45     padding-left:1em;
  46     padding-top:0.1em;
  47 }
  48
  49 .sws-cover .sws-content :first-child {
  50     position: relative;
  51 }
  52 .sws-cover.sws-inner-canvas {
  53     height: 100%;
  54 }
  55
  56 .sws-cover h1,
  57 .sws-cover h2,
  58 .sws-cover h3,
  59 .sws-cover a {
  60     display:bock;
  61     text-align:left;
  62     color: white;
  63     background-color: transparent;
  64     padding: 0 0 0 0;
  65     margin: 0 0 0 0;
  66 }
  67 .sws-cover h2 {
  68     font-size:100%;
  69 }
  70 .sws-cover h3,
  71 .sws-cover a {
  72     font-size:70%;
  73 }
  74
  75 .sws-cover h1:first-of-type {
  76     font-size: 250%;
  77     font-variant:small-caps;
  78 }
  79
  80
  81 .sws-toc { position: absolute;
  82            left: 0;
  83            bottom: 0;
  84            right: 0;
  85            top:0;
  86          }
  87
  88 .sws-toc > .sws-content {
  89     position:absolute;
  90     top: 20%;
  91     width:100%;
  92 }
  93
  94 .sws-title h1 {
  95      color: white;
  96      font-size: 175%;
  97      text-align: left;
  98      box-sizing:border-box;
  99      padding-left:0.75em;
 100      padding-top:0.25em;
 101      width:100%;
 102      height:100%;
 103      background-color:#00537f;
 104      background-image: url(reserve_upsay.svg);
 105      background-size:auto  100%;
 106      background-position: right top;
 107      background-repeat: no-repeat;
 108 }
 109 .sws-title::before {
 110     content : " ";
 111     position:absolute;
 112     background-image: url(logo_upsay_blanc.svg);
 113     background-size:auto  100%;
 114     background-position: right top;
 115     background-repeat: no-repeat;
 116     width:3em;
 117     height:1em;
 118     right:2em;
 119     bottom: 0.2em;
 120 }
 121 .sws-canvas {
 122     color: #696968;
 123     background: #fff;
 124     padding:0;
 125     margin: 0;
 126     position:relative;
 127     z-index:0;
 128 }
 129
 130
 131 .sws-inner-canvas {
 132     height: 85%;
 133     z-index: 2;
 134     position: relative; /* to make z-index work */
 135     margin:0;
 136     box-sizing:border-box;
 137 }
 138
 139 /* Title of the slide */
 140 .sws-title {
 141     position:relative;
 142     height: 10%;
 143     z-index: 2;
 144
 145 }
 146
 147 .sws-footer {
 148     height: 5%;
 149     text-align:right;
 150     box-sizing:border-box;
 151     padding-right:0.5em;
 152     vertical-align: middle;
 153     z-index: 1;
 154     overflow: visible;
 155     position:relative;
 156 }
 157
 158 .sws-footer::before {
 159     position: absolute;
 160     left:5%;
 161     display:inline-block;
 162     content: " ";
 163     width: 90%;
 164     top: -0.1em;
 165     border-top:#92b938 0.1em solid;
 166 }
 167
 168 .sws-slide-num-sep:after {
 169     content: "/";
 170 }
 171
 172
 173 @font-face {
 174   src: url("DIN-Bold.ttf") format("truetype");
 175   font-family: "DIN";
 176 }
 177
 178 @font-face {
 179   src: url("DIN-Black.ttf") format("truetype");
 180   font-family: "DIN";
 181   font-weight: bold;
 182 }
 183
 184
 185
 186 body {
 187     font-family: "DIN", sans-serif;
 188     background-color: white;
 189     color: #696968;
 190 }
 191
 192 p {
 193     display:block;
 194     width:92%;
 195     padding: 0 4% 0 4%;
 196     text-align:justify;
 197
 198 }
 199
 200 hr {
 201     border: none;
 202 }
 203
 204 code, pre, tt {
 205     font-family: 'Inconsolata', monospace;
 206     /*color: #494948;*/
 207 }
 208
 209 code {
 210     display: block;
 211     white-space: pre;
 212 }
 213
 214 ul  {
 215     list-style-type: none;
 216 }
 217 ul > li:before {
 218     content:"⏹  ";
 219     color:#92b938;
 220     white-space:pre;
 221     font-size:90%;
 222     position:relative;
 223     top:-0.15em;
 224 }
 225
 226 .sws-toc li:before {
 227     content:"";
 228 }
 229
 230 ul, ol {
 231     list-style-position: inside;
 232     width: 92%;
 233     padding: 0 4% 0 4%;
 234 }
 235
 236 ul.empty {
 237     list-style-type: none;
 238 }
 239
 240 .hl {
 241     color:    #92b938;
 242 }
 243
 244 .done::after {
 245     content: " ✔";
 246 }
 247
 248 li {
 249     margin-top:0.5vmin;
 250 }
 251
 252 tt em, code em {
 253     color: #729918;
 254 }
 255
 256 em {
 257     color: #92b938;
 258     font-style:normal;
 259 }
 260
 261 s {
 262     color: #ff1111;
 263     font-style: normal;
 264     text-decoration: none;
 265 }
 266
 267 a {
 268     color: #92b938;
 269     text-decoration:none;
 270     font-style:normal;
 271 }
 272
 273 table.desc {
 274     width: 100%;
 275     padding: 0% 4% 0% 4%;
 276     margin: 0 0 0 0;
 277 }
 278
 279 table.desc tr {
 280     margin: 0 0 0 0;
 281     padding: 0 0 0 0;
 282
 283 }
 284 table.desc td {
 285     vertical-align: top;
 286     text-align: justify;
 287     margin: 0 0 0 0;
 288 }
 289
 290 table.desc td:first-child {
 291     color: #92b938;
 292 }
 293
 294 table.desc td:first-child:after {
 295     content: " : ";
 296 }
 297
 298 .centerbox {
 299     text-align: center;
 300 }
 301
 302 table.rounded {
 303     border-collapse: separate;
 304     border-spacing: 0.5em 0.5em ;
 305 }
 306 .rounded td {
 307     padding: 0.5em 0 0.5em 0;
 308
 309     text-align: center;
 310     vertical-align:top;
 311     border-style:solid;
 312     border-color: #696968;
 313     border-width: 2pt;
 314     border-radius: 0.5em;
 315 }
 316 .rounded tr {
 317     display:table-row;
 318     width: 100%;
 319     margin: 1em;
 320 }
 321
 322 table.btable {
 323     border-collapse: collapse;
 324 }
 325
 326 .btable td {
 327     border: solid 1pt #696968;
 328 }
 329
 330 dl {
 331     padding: 1vmin 1em 1vmin 1em;
 332 }
 333
 334 dt { display: inline;
 335      color: #92b938;
 336      float:left;
 337    }
 338
 339 dt:after {
 340     display:inline;
 341     content: " : ";
 342 }
 343
 344 dd { display: block;
 345      padding: 0 0 0 4em;
 346      text-indent: 1em;
 347      margin: 0 0 0 0;
 348    }
 349
 350 table.simple {
 351     table-layout:fixed;
 352     padding: 0 4% 0 4%;
 353     text-align:left;
 354     border-spacing: 2em 0;
 355 }
 356
 357 table.simple th{
 358  color: #92b938;
 359  font-weight: normal;
 360  text-align:left;
 361 }
 362 table.simple th,
 363 table.simple tr {
 364     vertical-align:top;
 365 }
 366 .css3:after {
 367     content:"CSS3";
 368     color:white;
 369     background: #0a64a4;
 370     border-radius:0.25em;
 371     font-size:small;
 372     margin: 0.25em;
 373     padding:0.1em;
 374 }
 375
 376 div.twocol {
 377     width:99%;
 378     position:absolute;
 379     top:5em;
 380 }
 381
 382 div.twocol > div:first-child {
 383     display:inline-block;width:47%;
 384     position:absolute;
 385     box-sizing:border-box;
 386     padding: 0 1em;
 387     border-style:dashed;
 388     border-width: 0 1pt 0 0;
 389     border-color:gray;
 390     left: 0pt;
 391     top:0pt;
 392 }
 393
 394 div.twocol > div:last-child {
 395     display:inline-block;
 396     width:47%;
 397     position:absolute;
 398     box-sizing:border-box;
 399     padding: 0 0em 0 5em;
 400     vertical-align:text-top;
 401     right: 0pt;
 402     top:0pt;
 403 }
 404 table.withborder {
 405     border-collapse: collapse;
 406 }
 407 table.withborder td {
 408     border-style: solid;
 409     border-width: 1pt;
 410     min-width:20pt;
 411     height: 20pt;
 412 }
 413
 414 mark {
 415     color: #ff6612;
 416     background: none;
 417 }
 418
 419 u {
 420     color: #00486c;
 421     background: none;
 422     text-decoration: none;
 423 }
 424
 425 kbd {
 426     color: #393938;
 427     font-family:inherit;
 428 }
 429
 430
 431 cite {
 432     display:block;
 433     text-align:center;
 434 }
 435
 436 dl.codelist dt {
 437     font-family: 'Inconsolata', monospace;
 438 }
 439
 440 .solidbg {
 441     background:white;
 442 }
 443 math {
 444     color: #00486c;
 445     font-family:'Computer Modern Serif';
 446     font-style: normal;
 447     font-weight:bold;
 448     border-color:  #00486c;
 449
 450 }
 451 math mfrac {
 452     display: inline-block;
 453     vertical-align:middle;
 454     text-align: center;
 455 }
 456 math mfrac > mi { display: block; }
 457 math mfrac mi:first-of-type {
 458     border-bottom-color:  #00486c;
 459     border-bottom-style: solid;
 460     border-bottom-width: 0.1em;
 461 }
 462 var, cite {
 463     /*    color: #696968; */
 464     color: #00486c;
 465     font-family:'Computer Modern Serif';
 466     font-style: normal;
 467     font-weight:bold;
 468     border-color:  #00486c;
 469
 470 }
 471
 472 img.inline {
 473     vertical-align:middle;
 474     height:auto;
 475     width:5em;
 476 }
 477
 478
 479 :root.sws-print em {
 480     border-bottom-style:solid;
 481     border-bottom-width: 0.1em;
 482 }
 483
 484 :root.sws-print mark {
 485     border-bottom-style:dotted;
 486     border-bottom-width: 0.1em;
 487 }