redakcja/static/edumed/css/edumed.css

   1 body {
   2     font-size: 16px;
   3     font: Georgia, "Times New Roman", serif;
   4     line-height: 1.5em;
   5     margin: 0;
   6 }
   7
   8 a {
   9     color: blue;
  10     text-decoration: none;
  11 }
  12
  13 #book-text {
  14     margin: 3em;
  15     max-width: 640px;
  16 }
  17
  18 /* ================================== */
  19 /* = Header with logo and menu      = */
  20 /* ================================== */
  21 #header {
  22     margin: 3.4em 0 0 1.4em;
  23 }
  24
  25 img {
  26     border: none;
  27 }
  28
  29 #logo {
  30     font-size: 1.5em;
  31 }
  32 #logo a {
  33     color: black;
  34 }
  35
  36 #menu {
  37     position: fixed;
  38     left: 0em;
  39     top: 0em;
  40     width: 100%;
  41     height: 1.5em;
  42     background: #333;
  43     color: #FFF;
  44     opacity: 0.9;
  45     z-index: 99;
  46 }
  47
  48 #menu ul {
  49     list-style: none;
  50     padding: 0;
  51     margin: 0;
  52 }
  53
  54 #menu li a {
  55     display: block;
  56     float: left;
  57     height: 1.5em;
  58     margin-left: 0.5em;
  59     text-align: center;
  60     color: #FFF;
  61     padding: 0 1em;
  62 }
  63 #menu li a.menu {
  64     padding-right: 1.5em;
  65 }
  66
  67 #menu li a.menu:hover, #menu li a.menu:active {
  68     color: #000;
  69     background: #FFF url(/static/img/arrow-down.png) no-repeat center right;
  70 }
  71
  72 #menu li a.menu.selected {
  73     color: #000;
  74     background: #FFF url(/static/img/arrow-up.png) no-repeat center right;
  75 }
  76 #menu a.menu-link {
  77     display: block;
  78     float: left;
  79     height: 1.5em;
  80     margin-left: 0.5em;
  81     text-align: center;
  82     color: #FFF;
  83 }
  84 #menu span {
  85     color: #888;
  86     font-style: italic;
  87     font-size: .75em;
  88     margin-right: 0.5em;
  89 }
  90
  91
  92 #toc, #themes, #nota_red, #info {
  93     position: fixed;
  94     left: 0em;
  95     top: 1.5em;
  96     width: 37em;
  97     padding: 1.5em;
  98     background: #FFF;
  99     border-bottom: 0.25em solid #DDD;
 100     border-right: 0.25em solid #DDD;
 101     display: none;
 102     height: 16em;
 103     overflow-x: hidden;
 104     overflow-y: auto;
 105     opacity: 0.9;
 106     z-index: 99;
 107 }
 108 #download {
 109     position: fixed;
 110     left: 0em;
 111     top: 1.5em;
 112     width: 37em;
 113     padding: 1.5em;
 114     background: #FFF;
 115     border-bottom: 0.25em solid #DDD;
 116     border-right: 0.25em solid #DDD;
 117     display: none;
 118     height: 10em;
 119     overflow-x: hidden;
 120     overflow-y: auto;
 121     opacity: 0.9;
 122     z-index: 99;
 123 }
 124
 125 #toc ol, #themes ol {
 126     list-style: none;
 127     padding: 0;
 128     margin: 0;
 129 }
 130
 131 #toc ol li {
 132     font-weight: bold;
 133 }
 134
 135 #toc ol ol {
 136     padding: 0 0 1.5em 1.5em;
 137     margin: 0;
 138 }
 139
 140 #toc ol ol li {
 141     font-weight: normal;
 142 }
 143
 144 #toc h2 {
 145     display: none;
 146 }
 147
 148 #toc .anchor {
 149     float: none;
 150     margin: 0;
 151     color: blue;
 152     font-size: 16px;
 153     position: inherit;
 154 }
 155
 156 #info p {
 157     text-align: justify;
 158     margin: 1.5em 0 0;
 159 }
 160
 161 /* =================================================== */
 162 /* = Common elements: headings, paragraphs and lines = */
 163 /* =================================================== */
 164 h1 {
 165     font-size: 3em;
 166     margin: 1.5em 0;
 167     text-align: center;
 168     line-height: 1.5em;
 169     font-weight: bold;
 170 }
 171
 172 h2 {
 173     font-size: 2em;
 174     margin: 1.5em 0 0;
 175     font-weight: bold;
 176     line-height: 1.5em;
 177 }
 178
 179 h3 {
 180     font-size: 1.5em;
 181     margin: 1.5em 0 0;
 182     font-weight: normal;
 183     line-height: 1.5em;
 184 }
 185
 186 h4 {
 187     font-size: 1em;
 188     margin: 1.5em 0 0;
 189     line-height: 1.5em;
 190 }
 191
 192 p {
 193     margin: 0;
 194 }
 195
 196 /* ======================== */
 197 /* = Footnotes and themes = */
 198 /* ======================== */
 199 .theme-begin {
 200     border-left: 0.1em solid #DDDDDD;
 201     color: #777;
 202     padding: 0 0.5em;
 203     width: 7.5em;
 204
 205     font-style: normal;
 206     font-weight: normal;
 207     font-variant: normal;
 208     letter-spacing: 0;
 209     text-transform: none;
 210     text-decoration: none;
 211
 212     font-size: 16px;
 213     float: right;
 214     margin-right: -9.5em;
 215     margin-bottom: 0.5em;
 216     clear: both;
 217     left: 40em;
 218     line-height: 1.5em;
 219     text-align: left;
 220 }
 221
 222 .annotation {
 223     font-style: normal;
 224     font-weight: normal;
 225     font-size: 12px;
 226     padding-left: 2px;
 227     position: relative;
 228     top: -4px;
 229 }
 230
 231 #footnotes {
 232     margin-top: 3em;
 233 }
 234
 235 #footnotes .annotation {
 236     display: block;
 237     float: left;
 238     width: 2.5em;
 239     clear: both;
 240 }
 241
 242 #footnotes div {
 243     margin: 1.5em 0 0 0;
 244 }
 245
 246 #footnotes p, #footnotes ul {
 247     margin-left: 2.5em;
 248     font-size: 0.875em;
 249 }
 250
 251 #footnotes .permalink {
 252     font-size: .75em;
 253 }
 254
 255 blockquote {
 256     font-size: 0.875em;
 257 }
 258
 259 /* ============= */
 260 /* = Numbering = */
 261 /* ============= */
 262 .verse, .paragraph {
 263     position:relative;
 264 }
 265 .anchor {
 266     position: absolute;
 267     margin: -0.25em -0.5em;
 268     left: -3em;
 269     color: #777;
 270     font-size: 12px;
 271     width: 2em;
 272     text-align: center;
 273     padding: 0.25em 0.5em;
 274     line-height: 1.5em;
 275 }
 276
 277 .anchor:hover, #book-text .anchor:active {
 278     color: #FFF;
 279     background-color: #CCC;
 280 }
 281
 282 /* =================== */
 283 /* = Custom elements = */
 284 /* =================== */
 285 span.author {
 286     font-size: 0.5em;
 287     display: block;
 288     line-height: 1.5em;
 289     margin-bottom: 0.25em;
 290 }
 291
 292 span.collection {
 293     font-size: 0.375em;
 294     display: block;
 295     line-height: 1.5em;
 296     margin-bottom: -0.25em;
 297 }
 298
 299 span.subtitle {
 300     font-size: 0.5em;
 301     display: block;
 302     line-height: 1.5em;
 303     margin-top: -0.25em;
 304 }
 305
 306 span.translator {
 307     font-size: 0.375em;
 308     display: block;
 309     line-height: 1.5em;
 310     margin-top: 0.25em;
 311 }
 312
 313 div.didaskalia {
 314     font-style: italic;
 315     margin: 0.5em 0 0 1.5em;
 316 }
 317
 318 div.kwestia {
 319     margin: 0.5em 0 0;
 320 }
 321
 322 div.stanza {
 323     margin: 1.5em 0 0;
 324 }
 325
 326 div.kwestia div.stanza {
 327     margin: 0;
 328 }
 329
 330 p.paragraph {
 331     text-align: justify;
 332     margin: 1.5em 0 0;
 333 }
 334
 335 p.motto {
 336     text-align: justify;
 337     font-style: italic;
 338     margin: 1.5em 0 0;
 339 }
 340
 341 p.motto_podpis {
 342     font-size: 0.875em;
 343     text-align: right;
 344 }
 345
 346 div.fragment {
 347     border-bottom: 0.1em solid #999;
 348     padding-bottom: 1.5em;
 349 }
 350
 351 div.note p, div.dedication p, div.note p.paragraph, div.dedication p.paragraph {
 352     text-align: right;
 353     font-style: italic;
 354 }
 355
 356 hr.spacer {
 357     height: 3em;
 358     visibility: hidden;
 359 }
 360
 361 hr.spacer-line {
 362     margin: 1.5em 0;
 363     border: none;
 364     border-bottom: 0.1em solid #000;
 365 }
 366
 367 p.spacer-asterisk {
 368     padding: 0;
 369     margin: 1.5em 0;
 370     text-align: center;
 371 }
 372
 373 div.person-list ol {
 374     list-style: none;
 375     padding: 0 0 0 1.5em;
 376 }
 377
 378 p.place-and-time {
 379     font-style: italic;
 380 }
 381
 382 em.math, em.foreign-word, em.book-title, em.didaskalia {
 383     font-style: italic;
 384 }
 385
 386 em.author-emphasis {
 387     letter-spacing: 0.1em;
 388 }
 389
 390 em.person {
 391     font-style: normal;
 392     font-variant: small-caps;
 393 }
 394
 395 .verse:after {
 396     content: "\feff";
 397 }
 398
 399
 400 /* =================================== */
 401 /* = Hide some elements for printing = */
 402 /* =================================== */
 403
 404 @media print {
 405     #menu {display: none;}
 406 }
 407
 408 .activity .text {
 409  max-width:350px;
 410  margin-right:20px;
 411  float: left;
 412 }
 413
 414 .activity .description p:first-child {
 415   margin-top: 0;
 416 }
 417
 418 .activity .info {
 419  margin: 1.5em 0 0;
 420  max-width: 130px;
 421  float:right;
 422 }
 423
 424 .activity .info  p {
 425  margin-bottom: 1em;
 426 }
 427
 428
 429 .activity {
 430  clear:both;
 431 }
 432
 433 .activity .info {
 434  font-size: 10pt;
 435 }
 436
 437 .clearboth {
 438  clear: both;
 439 }
 440
 441
 442 .excercise .buttons {
 443     text-align: right;
 444 }
 445
 446 .teacher {
 447     display: none;
 448 }
 449
 450 .teacher.show {
 451     display: inherit;
 452 }
 453
 454 .question-piece.correct {
 455     background-color: darkgreen;
 456 }
 457
 458 .question-piece.incorrect {
 459     background-color: orange;
 460 }
 461
 462 .buttons .chosen {
 463     background-color: lightblue;
 464 }
 465
 466
 467
 468 .excercise .lista.predicate {
 469     list-style: none;
 470     position: relative;
 471     clear: both;
 472     padding-left: 0;
 473 }
 474
 475
 476 .excercise .subjects {
 477     padding-left: 0;
 478 }
 479
 480
 481 .excercise .lista.predicate > li {
 482     list-style: none;
 483     display: block;
 484     float: left;
 485     width: 208px;
 486     margin: 2px;
 487 }
 488
 489 .excercise.wide .lista.predicate > li {
 490     width: 100%;
 491     margin: 2px;
 492 }
 493
 494 .excercise .lista.predicate .droppable {
 495     min-height: 50px;
 496     border: 1px dotted black;
 497 }
 498
 499
 500 .excercise .draggable {
 501     padding: 3px;
 502     border: 1px dotted black;
 503     display: inline-block;
 504 }
 505
 506 .excercise .draggable.disabled {
 507     background-color: grey;
 508 }
 509
 510 .excercise .placeholder {
 511     padding: 3px;
 512     border: 1px dotted black;
 513     display: inline-block;
 514     min-width: 200px;
 515     min-height: 1em;
 516 }
 517
 518 .excercise .placeholder.accepting.dragover {
 519     background-color: #ffff99;
 520 }
 521
 522
 523 .excercise.zastap .paragraph .placeholder {
 524     display: inline;
 525     min-width: none;
 526     min-height: none;
 527     border: inherit;
 528     padding: inherit;
 529 }
 530
 531
 532
 533 .excercise .lista.subjects {
 534     padding-left: 0px;
 535 }
 536
 537
 538 .draggable .remove {
 539     font-family: sans-serif;
 540     padding: 2px 4px;
 541     background-color: #ee6666;
 542     margin-left: 5px;
 543 }
 544
 545 /* utils */
 546
 547 .clr {
 548     clear: both;
 549 }
 550