github.com/sentienttechnologies/studio-go-runner@v0.0.0-20201118202441-6d21f2ced8ee/docs/slides/css/reveal.css (about) 1 /*! 2 * reveal.js 3 * http://revealjs.com 4 * MIT licensed 5 * 6 * Copyright (C) 2017 Hakim El Hattab, http://hakim.se 7 */ 8 /********************************************* 9 * RESET STYLES 10 *********************************************/ 11 html, body, .reveal div, .reveal span, .reveal applet, .reveal object, .reveal iframe, 12 .reveal h1, .reveal h2, .reveal h3, .reveal h4, .reveal h5, .reveal h6, .reveal p, .reveal blockquote, .reveal pre, 13 .reveal a, .reveal abbr, .reveal acronym, .reveal address, .reveal big, .reveal cite, .reveal code, 14 .reveal del, .reveal dfn, .reveal em, .reveal img, .reveal ins, .reveal kbd, .reveal q, .reveal s, .reveal samp, 15 .reveal small, .reveal strike, .reveal strong, .reveal sub, .reveal sup, .reveal tt, .reveal var, 16 .reveal b, .reveal u, .reveal center, 17 .reveal dl, .reveal dt, .reveal dd, .reveal ol, .reveal ul, .reveal li, 18 .reveal fieldset, .reveal form, .reveal label, .reveal legend, 19 .reveal table, .reveal caption, .reveal tbody, .reveal tfoot, .reveal thead, .reveal tr, .reveal th, .reveal td, 20 .reveal article, .reveal aside, .reveal canvas, .reveal details, .reveal embed, 21 .reveal figure, .reveal figcaption, .reveal footer, .reveal header, .reveal hgroup, 22 .reveal menu, .reveal nav, .reveal output, .reveal ruby, .reveal section, .reveal summary, 23 .reveal time, .reveal mark, .reveal audio, .reveal video { 24 margin: 0; 25 padding: 0; 26 border: 0; 27 font-size: 100%; 28 font: inherit; 29 vertical-align: baseline; } 30 31 .reveal article, .reveal aside, .reveal details, .reveal figcaption, .reveal figure, 32 .reveal footer, .reveal header, .reveal hgroup, .reveal menu, .reveal nav, .reveal section { 33 display: block; } 34 35 /********************************************* 36 * GLOBAL STYLES 37 *********************************************/ 38 html, 39 body { 40 width: 100%; 41 height: 100%; 42 overflow: hidden; } 43 44 body { 45 position: relative; 46 line-height: 1; 47 background-color: #fff; 48 color: #000; } 49 50 /********************************************* 51 * VIEW FRAGMENTS 52 *********************************************/ 53 .reveal .slides section .fragment { 54 opacity: 0; 55 visibility: hidden; 56 transition: all .2s ease; } 57 .reveal .slides section .fragment.visible { 58 opacity: 1; 59 visibility: inherit; } 60 61 .reveal .slides section .fragment.grow { 62 opacity: 1; 63 visibility: inherit; } 64 .reveal .slides section .fragment.grow.visible { 65 -webkit-transform: scale(1.3); 66 transform: scale(1.3); } 67 68 .reveal .slides section .fragment.shrink { 69 opacity: 1; 70 visibility: inherit; } 71 .reveal .slides section .fragment.shrink.visible { 72 -webkit-transform: scale(0.7); 73 transform: scale(0.7); } 74 75 .reveal .slides section .fragment.zoom-in { 76 -webkit-transform: scale(0.1); 77 transform: scale(0.1); } 78 .reveal .slides section .fragment.zoom-in.visible { 79 -webkit-transform: none; 80 transform: none; } 81 82 .reveal .slides section .fragment.fade-out { 83 opacity: 1; 84 visibility: inherit; } 85 .reveal .slides section .fragment.fade-out.visible { 86 opacity: 0; 87 visibility: hidden; } 88 89 .reveal .slides section .fragment.semi-fade-out { 90 opacity: 1; 91 visibility: inherit; } 92 .reveal .slides section .fragment.semi-fade-out.visible { 93 opacity: 0.5; 94 visibility: inherit; } 95 96 .reveal .slides section .fragment.strike { 97 opacity: 1; 98 visibility: inherit; } 99 .reveal .slides section .fragment.strike.visible { 100 text-decoration: line-through; } 101 102 .reveal .slides section .fragment.fade-up { 103 -webkit-transform: translate(0, 20%); 104 transform: translate(0, 20%); } 105 .reveal .slides section .fragment.fade-up.visible { 106 -webkit-transform: translate(0, 0); 107 transform: translate(0, 0); } 108 109 .reveal .slides section .fragment.fade-down { 110 -webkit-transform: translate(0, -20%); 111 transform: translate(0, -20%); } 112 .reveal .slides section .fragment.fade-down.visible { 113 -webkit-transform: translate(0, 0); 114 transform: translate(0, 0); } 115 116 .reveal .slides section .fragment.fade-right { 117 -webkit-transform: translate(-20%, 0); 118 transform: translate(-20%, 0); } 119 .reveal .slides section .fragment.fade-right.visible { 120 -webkit-transform: translate(0, 0); 121 transform: translate(0, 0); } 122 123 .reveal .slides section .fragment.fade-left { 124 -webkit-transform: translate(20%, 0); 125 transform: translate(20%, 0); } 126 .reveal .slides section .fragment.fade-left.visible { 127 -webkit-transform: translate(0, 0); 128 transform: translate(0, 0); } 129 130 .reveal .slides section .fragment.current-visible { 131 opacity: 0; 132 visibility: hidden; } 133 .reveal .slides section .fragment.current-visible.current-fragment { 134 opacity: 1; 135 visibility: inherit; } 136 137 .reveal .slides section .fragment.highlight-red, 138 .reveal .slides section .fragment.highlight-current-red, 139 .reveal .slides section .fragment.highlight-green, 140 .reveal .slides section .fragment.highlight-current-green, 141 .reveal .slides section .fragment.highlight-blue, 142 .reveal .slides section .fragment.highlight-current-blue { 143 opacity: 1; 144 visibility: inherit; } 145 146 .reveal .slides section .fragment.highlight-red.visible { 147 color: #ff2c2d; } 148 149 .reveal .slides section .fragment.highlight-green.visible { 150 color: #17ff2e; } 151 152 .reveal .slides section .fragment.highlight-blue.visible { 153 color: #1b91ff; } 154 155 .reveal .slides section .fragment.highlight-current-red.current-fragment { 156 color: #ff2c2d; } 157 158 .reveal .slides section .fragment.highlight-current-green.current-fragment { 159 color: #17ff2e; } 160 161 .reveal .slides section .fragment.highlight-current-blue.current-fragment { 162 color: #1b91ff; } 163 164 /********************************************* 165 * DEFAULT ELEMENT STYLES 166 *********************************************/ 167 /* Fixes issue in Chrome where italic fonts did not appear when printing to PDF */ 168 .reveal:after { 169 content: ''; 170 font-style: italic; } 171 172 .reveal iframe { 173 z-index: 1; } 174 175 /** Prevents layering issues in certain browser/transition combinations */ 176 .reveal a { 177 position: relative; } 178 179 .reveal .stretch { 180 max-width: none; 181 max-height: none; } 182 183 .reveal pre.stretch code { 184 height: 100%; 185 max-height: 100%; 186 box-sizing: border-box; } 187 188 /********************************************* 189 * CONTROLS 190 *********************************************/ 191 @-webkit-keyframes bounce-right { 192 0%, 10%, 25%, 40%, 50% { 193 -webkit-transform: translateX(0); 194 transform: translateX(0); } 195 20% { 196 -webkit-transform: translateX(10px); 197 transform: translateX(10px); } 198 30% { 199 -webkit-transform: translateX(-5px); 200 transform: translateX(-5px); } } 201 @keyframes bounce-right { 202 0%, 10%, 25%, 40%, 50% { 203 -webkit-transform: translateX(0); 204 transform: translateX(0); } 205 20% { 206 -webkit-transform: translateX(10px); 207 transform: translateX(10px); } 208 30% { 209 -webkit-transform: translateX(-5px); 210 transform: translateX(-5px); } } 211 212 @-webkit-keyframes bounce-down { 213 0%, 10%, 25%, 40%, 50% { 214 -webkit-transform: translateY(0); 215 transform: translateY(0); } 216 20% { 217 -webkit-transform: translateY(10px); 218 transform: translateY(10px); } 219 30% { 220 -webkit-transform: translateY(-5px); 221 transform: translateY(-5px); } } 222 223 @keyframes bounce-down { 224 0%, 10%, 25%, 40%, 50% { 225 -webkit-transform: translateY(0); 226 transform: translateY(0); } 227 20% { 228 -webkit-transform: translateY(10px); 229 transform: translateY(10px); } 230 30% { 231 -webkit-transform: translateY(-5px); 232 transform: translateY(-5px); } } 233 234 .reveal .controls { 235 display: none; 236 position: absolute; 237 top: auto; 238 bottom: 12px; 239 right: 12px; 240 left: auto; 241 z-index: 1; 242 color: #000; 243 pointer-events: none; 244 font-size: 10px; } 245 .reveal .controls button { 246 position: absolute; 247 padding: 0; 248 background-color: transparent; 249 border: 0; 250 outline: 0; 251 cursor: pointer; 252 color: currentColor; 253 -webkit-transform: scale(0.9999); 254 transform: scale(0.9999); 255 transition: color 0.2s ease, opacity 0.2s ease, -webkit-transform 0.2s ease; 256 transition: color 0.2s ease, opacity 0.2s ease, transform 0.2s ease; 257 z-index: 2; 258 pointer-events: auto; 259 font-size: inherit; 260 visibility: hidden; 261 opacity: 0; 262 -webkit-appearance: none; 263 -webkit-tap-highlight-color: transparent; } 264 .reveal .controls .controls-arrow:before, 265 .reveal .controls .controls-arrow:after { 266 content: ''; 267 position: absolute; 268 top: 0; 269 left: 0; 270 width: 2.6em; 271 height: 0.5em; 272 border-radius: 0.25em; 273 background-color: currentColor; 274 transition: all 0.15s ease, background-color 0.8s ease; 275 -webkit-transform-origin: 0.2em 50%; 276 transform-origin: 0.2em 50%; 277 will-change: transform; } 278 .reveal .controls .controls-arrow { 279 position: relative; 280 width: 3.6em; 281 height: 3.6em; } 282 .reveal .controls .controls-arrow:before { 283 -webkit-transform: translateX(0.5em) translateY(1.55em) rotate(45deg); 284 transform: translateX(0.5em) translateY(1.55em) rotate(45deg); } 285 .reveal .controls .controls-arrow:after { 286 -webkit-transform: translateX(0.5em) translateY(1.55em) rotate(-45deg); 287 transform: translateX(0.5em) translateY(1.55em) rotate(-45deg); } 288 .reveal .controls .controls-arrow:hover:before { 289 -webkit-transform: translateX(0.5em) translateY(1.55em) rotate(40deg); 290 transform: translateX(0.5em) translateY(1.55em) rotate(40deg); } 291 .reveal .controls .controls-arrow:hover:after { 292 -webkit-transform: translateX(0.5em) translateY(1.55em) rotate(-40deg); 293 transform: translateX(0.5em) translateY(1.55em) rotate(-40deg); } 294 .reveal .controls .controls-arrow:active:before { 295 -webkit-transform: translateX(0.5em) translateY(1.55em) rotate(36deg); 296 transform: translateX(0.5em) translateY(1.55em) rotate(36deg); } 297 .reveal .controls .controls-arrow:active:after { 298 -webkit-transform: translateX(0.5em) translateY(1.55em) rotate(-36deg); 299 transform: translateX(0.5em) translateY(1.55em) rotate(-36deg); } 300 .reveal .controls .navigate-left { 301 right: 6.4em; 302 bottom: 3.2em; 303 -webkit-transform: translateX(-10px); 304 transform: translateX(-10px); } 305 .reveal .controls .navigate-right { 306 right: 0; 307 bottom: 3.2em; 308 -webkit-transform: translateX(10px); 309 transform: translateX(10px); } 310 .reveal .controls .navigate-right .controls-arrow { 311 -webkit-transform: rotate(180deg); 312 transform: rotate(180deg); } 313 .reveal .controls .navigate-right.highlight { 314 -webkit-animation: bounce-right 2s 50 both ease-out; 315 animation: bounce-right 2s 50 both ease-out; } 316 .reveal .controls .navigate-up { 317 right: 3.2em; 318 bottom: 6.4em; 319 -webkit-transform: translateY(-10px); 320 transform: translateY(-10px); } 321 .reveal .controls .navigate-up .controls-arrow { 322 -webkit-transform: rotate(90deg); 323 transform: rotate(90deg); } 324 .reveal .controls .navigate-down { 325 right: 3.2em; 326 bottom: 0; 327 -webkit-transform: translateY(10px); 328 transform: translateY(10px); } 329 .reveal .controls .navigate-down .controls-arrow { 330 -webkit-transform: rotate(-90deg); 331 transform: rotate(-90deg); } 332 .reveal .controls .navigate-down.highlight { 333 -webkit-animation: bounce-down 2s 50 both ease-out; 334 animation: bounce-down 2s 50 both ease-out; } 335 .reveal .controls[data-controls-back-arrows="faded"] .navigate-left.enabled, 336 .reveal .controls[data-controls-back-arrows="faded"] .navigate-up.enabled { 337 opacity: 0.3; } 338 .reveal .controls[data-controls-back-arrows="faded"] .navigate-left.enabled:hover, 339 .reveal .controls[data-controls-back-arrows="faded"] .navigate-up.enabled:hover { 340 opacity: 1; } 341 .reveal .controls[data-controls-back-arrows="hidden"] .navigate-left.enabled, 342 .reveal .controls[data-controls-back-arrows="hidden"] .navigate-up.enabled { 343 opacity: 0; 344 visibility: hidden; } 345 .reveal .controls .enabled { 346 visibility: visible; 347 opacity: 0.9; 348 cursor: pointer; 349 -webkit-transform: none; 350 transform: none; } 351 .reveal .controls .enabled.fragmented { 352 opacity: 0.5; } 353 .reveal .controls .enabled:hover, 354 .reveal .controls .enabled.fragmented:hover { 355 opacity: 1; } 356 357 .reveal:not(.has-vertical-slides) .controls .navigate-left { 358 bottom: 1.4em; 359 right: 5.5em; } 360 361 .reveal:not(.has-vertical-slides) .controls .navigate-right { 362 bottom: 1.4em; 363 right: 0.5em; } 364 365 .reveal:not(.has-horizontal-slides) .controls .navigate-up { 366 right: 1.4em; 367 bottom: 5em; } 368 369 .reveal:not(.has-horizontal-slides) .controls .navigate-down { 370 right: 1.4em; 371 bottom: 0.5em; } 372 373 .reveal.has-dark-background .controls { 374 color: #fff; } 375 376 .reveal.has-light-background .controls { 377 color: #000; } 378 379 .reveal.no-hover .controls .controls-arrow:hover:before, 380 .reveal.no-hover .controls .controls-arrow:active:before { 381 -webkit-transform: translateX(0.5em) translateY(1.55em) rotate(45deg); 382 transform: translateX(0.5em) translateY(1.55em) rotate(45deg); } 383 384 .reveal.no-hover .controls .controls-arrow:hover:after, 385 .reveal.no-hover .controls .controls-arrow:active:after { 386 -webkit-transform: translateX(0.5em) translateY(1.55em) rotate(-45deg); 387 transform: translateX(0.5em) translateY(1.55em) rotate(-45deg); } 388 389 @media screen and (min-width: 500px) { 390 .reveal .controls[data-controls-layout="edges"] { 391 top: 0; 392 right: 0; 393 bottom: 0; 394 left: 0; } 395 .reveal .controls[data-controls-layout="edges"] .navigate-left, 396 .reveal .controls[data-controls-layout="edges"] .navigate-right, 397 .reveal .controls[data-controls-layout="edges"] .navigate-up, 398 .reveal .controls[data-controls-layout="edges"] .navigate-down { 399 bottom: auto; 400 right: auto; } 401 .reveal .controls[data-controls-layout="edges"] .navigate-left { 402 top: 50%; 403 left: 8px; 404 margin-top: -1.8em; } 405 .reveal .controls[data-controls-layout="edges"] .navigate-right { 406 top: 50%; 407 right: 8px; 408 margin-top: -1.8em; } 409 .reveal .controls[data-controls-layout="edges"] .navigate-up { 410 top: 8px; 411 left: 50%; 412 margin-left: -1.8em; } 413 .reveal .controls[data-controls-layout="edges"] .navigate-down { 414 bottom: 8px; 415 left: 50%; 416 margin-left: -1.8em; } } 417 418 /********************************************* 419 * PROGRESS BAR 420 *********************************************/ 421 .reveal .progress { 422 position: absolute; 423 display: none; 424 height: 3px; 425 width: 100%; 426 bottom: 0; 427 left: 0; 428 z-index: 10; 429 background-color: rgba(0, 0, 0, 0.2); 430 color: #fff; } 431 432 .reveal .progress:after { 433 content: ''; 434 display: block; 435 position: absolute; 436 height: 10px; 437 width: 100%; 438 top: -10px; } 439 440 .reveal .progress span { 441 display: block; 442 height: 100%; 443 width: 0px; 444 background-color: currentColor; 445 transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); } 446 447 /********************************************* 448 * SLIDE NUMBER 449 *********************************************/ 450 .reveal .slide-number { 451 position: fixed; 452 display: block; 453 right: 8px; 454 bottom: 8px; 455 z-index: 31; 456 font-family: Helvetica, sans-serif; 457 font-size: 12px; 458 line-height: 1; 459 color: #fff; 460 background-color: rgba(0, 0, 0, 0.4); 461 padding: 5px; } 462 463 .reveal .slide-number-delimiter { 464 margin: 0 3px; } 465 466 /********************************************* 467 * SLIDES 468 *********************************************/ 469 .reveal { 470 position: relative; 471 width: 100%; 472 height: 100%; 473 overflow: hidden; 474 -ms-touch-action: none; 475 touch-action: none; } 476 477 @media only screen and (orientation: landscape) { 478 .reveal.ua-iphone { 479 position: fixed; } } 480 481 .reveal .slides { 482 position: absolute; 483 width: 100%; 484 height: 100%; 485 top: 0; 486 right: 0; 487 bottom: 0; 488 left: 0; 489 margin: auto; 490 pointer-events: none; 491 overflow: visible; 492 z-index: 1; 493 text-align: center; 494 -webkit-perspective: 600px; 495 perspective: 600px; 496 -webkit-perspective-origin: 50% 40%; 497 perspective-origin: 50% 40%; } 498 499 .reveal .slides > section { 500 -ms-perspective: 600px; } 501 502 .reveal .slides > section, 503 .reveal .slides > section > section { 504 display: none; 505 position: absolute; 506 width: 100%; 507 padding: 20px 0px; 508 pointer-events: auto; 509 z-index: 10; 510 -webkit-transform-style: flat; 511 transform-style: flat; 512 transition: -webkit-transform-origin 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), -webkit-transform 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), visibility 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), opacity 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); 513 transition: transform-origin 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), transform 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), visibility 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), opacity 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); } 514 515 /* Global transition speed settings */ 516 .reveal[data-transition-speed="fast"] .slides section { 517 transition-duration: 400ms; } 518 519 .reveal[data-transition-speed="slow"] .slides section { 520 transition-duration: 1200ms; } 521 522 /* Slide-specific transition speed overrides */ 523 .reveal .slides section[data-transition-speed="fast"] { 524 transition-duration: 400ms; } 525 526 .reveal .slides section[data-transition-speed="slow"] { 527 transition-duration: 1200ms; } 528 529 .reveal .slides > section.stack { 530 padding-top: 0; 531 padding-bottom: 0; } 532 533 .reveal .slides > section.present, 534 .reveal .slides > section > section.present { 535 display: block; 536 z-index: 11; 537 opacity: 1; } 538 539 .reveal .slides > section:empty, 540 .reveal .slides > section > section:empty, 541 .reveal .slides > section[data-background-interactive], 542 .reveal .slides > section > section[data-background-interactive] { 543 pointer-events: none; } 544 545 .reveal.center, 546 .reveal.center .slides, 547 .reveal.center .slides section { 548 min-height: 0 !important; } 549 550 /* Don't allow interaction with invisible slides */ 551 .reveal .slides > section.future, 552 .reveal .slides > section > section.future, 553 .reveal .slides > section.past, 554 .reveal .slides > section > section.past { 555 pointer-events: none; } 556 557 .reveal.overview .slides > section, 558 .reveal.overview .slides > section > section { 559 pointer-events: auto; } 560 561 .reveal .slides > section.past, 562 .reveal .slides > section.future, 563 .reveal .slides > section > section.past, 564 .reveal .slides > section > section.future { 565 opacity: 0; } 566 567 /********************************************* 568 * Mixins for readability of transitions 569 *********************************************/ 570 /********************************************* 571 * SLIDE TRANSITION 572 * Aliased 'linear' for backwards compatibility 573 *********************************************/ 574 .reveal.slide section { 575 -webkit-backface-visibility: hidden; 576 backface-visibility: hidden; } 577 578 .reveal .slides > section[data-transition=slide].past, 579 .reveal .slides > section[data-transition~=slide-out].past, 580 .reveal.slide .slides > section:not([data-transition]).past { 581 -webkit-transform: translate(-150%, 0); 582 transform: translate(-150%, 0); } 583 584 .reveal .slides > section[data-transition=slide].future, 585 .reveal .slides > section[data-transition~=slide-in].future, 586 .reveal.slide .slides > section:not([data-transition]).future { 587 -webkit-transform: translate(150%, 0); 588 transform: translate(150%, 0); } 589 590 .reveal .slides > section > section[data-transition=slide].past, 591 .reveal .slides > section > section[data-transition~=slide-out].past, 592 .reveal.slide .slides > section > section:not([data-transition]).past { 593 -webkit-transform: translate(0, -150%); 594 transform: translate(0, -150%); } 595 596 .reveal .slides > section > section[data-transition=slide].future, 597 .reveal .slides > section > section[data-transition~=slide-in].future, 598 .reveal.slide .slides > section > section:not([data-transition]).future { 599 -webkit-transform: translate(0, 150%); 600 transform: translate(0, 150%); } 601 602 .reveal.linear section { 603 -webkit-backface-visibility: hidden; 604 backface-visibility: hidden; } 605 606 .reveal .slides > section[data-transition=linear].past, 607 .reveal .slides > section[data-transition~=linear-out].past, 608 .reveal.linear .slides > section:not([data-transition]).past { 609 -webkit-transform: translate(-150%, 0); 610 transform: translate(-150%, 0); } 611 612 .reveal .slides > section[data-transition=linear].future, 613 .reveal .slides > section[data-transition~=linear-in].future, 614 .reveal.linear .slides > section:not([data-transition]).future { 615 -webkit-transform: translate(150%, 0); 616 transform: translate(150%, 0); } 617 618 .reveal .slides > section > section[data-transition=linear].past, 619 .reveal .slides > section > section[data-transition~=linear-out].past, 620 .reveal.linear .slides > section > section:not([data-transition]).past { 621 -webkit-transform: translate(0, -150%); 622 transform: translate(0, -150%); } 623 624 .reveal .slides > section > section[data-transition=linear].future, 625 .reveal .slides > section > section[data-transition~=linear-in].future, 626 .reveal.linear .slides > section > section:not([data-transition]).future { 627 -webkit-transform: translate(0, 150%); 628 transform: translate(0, 150%); } 629 630 /********************************************* 631 * CONVEX TRANSITION 632 * Aliased 'default' for backwards compatibility 633 *********************************************/ 634 .reveal .slides section[data-transition=default].stack, 635 .reveal.default .slides section.stack { 636 -webkit-transform-style: preserve-3d; 637 transform-style: preserve-3d; } 638 639 .reveal .slides > section[data-transition=default].past, 640 .reveal .slides > section[data-transition~=default-out].past, 641 .reveal.default .slides > section:not([data-transition]).past { 642 -webkit-transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); 643 transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); } 644 645 .reveal .slides > section[data-transition=default].future, 646 .reveal .slides > section[data-transition~=default-in].future, 647 .reveal.default .slides > section:not([data-transition]).future { 648 -webkit-transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); 649 transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); } 650 651 .reveal .slides > section > section[data-transition=default].past, 652 .reveal .slides > section > section[data-transition~=default-out].past, 653 .reveal.default .slides > section > section:not([data-transition]).past { 654 -webkit-transform: translate3d(0, -300px, 0) rotateX(70deg) translate3d(0, -300px, 0); 655 transform: translate3d(0, -300px, 0) rotateX(70deg) translate3d(0, -300px, 0); } 656 657 .reveal .slides > section > section[data-transition=default].future, 658 .reveal .slides > section > section[data-transition~=default-in].future, 659 .reveal.default .slides > section > section:not([data-transition]).future { 660 -webkit-transform: translate3d(0, 300px, 0) rotateX(-70deg) translate3d(0, 300px, 0); 661 transform: translate3d(0, 300px, 0) rotateX(-70deg) translate3d(0, 300px, 0); } 662 663 .reveal .slides section[data-transition=convex].stack, 664 .reveal.convex .slides section.stack { 665 -webkit-transform-style: preserve-3d; 666 transform-style: preserve-3d; } 667 668 .reveal .slides > section[data-transition=convex].past, 669 .reveal .slides > section[data-transition~=convex-out].past, 670 .reveal.convex .slides > section:not([data-transition]).past { 671 -webkit-transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); 672 transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); } 673 674 .reveal .slides > section[data-transition=convex].future, 675 .reveal .slides > section[data-transition~=convex-in].future, 676 .reveal.convex .slides > section:not([data-transition]).future { 677 -webkit-transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); 678 transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); } 679 680 .reveal .slides > section > section[data-transition=convex].past, 681 .reveal .slides > section > section[data-transition~=convex-out].past, 682 .reveal.convex .slides > section > section:not([data-transition]).past { 683 -webkit-transform: translate3d(0, -300px, 0) rotateX(70deg) translate3d(0, -300px, 0); 684 transform: translate3d(0, -300px, 0) rotateX(70deg) translate3d(0, -300px, 0); } 685 686 .reveal .slides > section > section[data-transition=convex].future, 687 .reveal .slides > section > section[data-transition~=convex-in].future, 688 .reveal.convex .slides > section > section:not([data-transition]).future { 689 -webkit-transform: translate3d(0, 300px, 0) rotateX(-70deg) translate3d(0, 300px, 0); 690 transform: translate3d(0, 300px, 0) rotateX(-70deg) translate3d(0, 300px, 0); } 691 692 /********************************************* 693 * CONCAVE TRANSITION 694 *********************************************/ 695 .reveal .slides section[data-transition=concave].stack, 696 .reveal.concave .slides section.stack { 697 -webkit-transform-style: preserve-3d; 698 transform-style: preserve-3d; } 699 700 .reveal .slides > section[data-transition=concave].past, 701 .reveal .slides > section[data-transition~=concave-out].past, 702 .reveal.concave .slides > section:not([data-transition]).past { 703 -webkit-transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0); 704 transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0); } 705 706 .reveal .slides > section[data-transition=concave].future, 707 .reveal .slides > section[data-transition~=concave-in].future, 708 .reveal.concave .slides > section:not([data-transition]).future { 709 -webkit-transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0); 710 transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0); } 711 712 .reveal .slides > section > section[data-transition=concave].past, 713 .reveal .slides > section > section[data-transition~=concave-out].past, 714 .reveal.concave .slides > section > section:not([data-transition]).past { 715 -webkit-transform: translate3d(0, -80%, 0) rotateX(-70deg) translate3d(0, -80%, 0); 716 transform: translate3d(0, -80%, 0) rotateX(-70deg) translate3d(0, -80%, 0); } 717 718 .reveal .slides > section > section[data-transition=concave].future, 719 .reveal .slides > section > section[data-transition~=concave-in].future, 720 .reveal.concave .slides > section > section:not([data-transition]).future { 721 -webkit-transform: translate3d(0, 80%, 0) rotateX(70deg) translate3d(0, 80%, 0); 722 transform: translate3d(0, 80%, 0) rotateX(70deg) translate3d(0, 80%, 0); } 723 724 /********************************************* 725 * ZOOM TRANSITION 726 *********************************************/ 727 .reveal .slides section[data-transition=zoom], 728 .reveal.zoom .slides section:not([data-transition]) { 729 transition-timing-function: ease; } 730 731 .reveal .slides > section[data-transition=zoom].past, 732 .reveal .slides > section[data-transition~=zoom-out].past, 733 .reveal.zoom .slides > section:not([data-transition]).past { 734 visibility: hidden; 735 -webkit-transform: scale(16); 736 transform: scale(16); } 737 738 .reveal .slides > section[data-transition=zoom].future, 739 .reveal .slides > section[data-transition~=zoom-in].future, 740 .reveal.zoom .slides > section:not([data-transition]).future { 741 visibility: hidden; 742 -webkit-transform: scale(0.2); 743 transform: scale(0.2); } 744 745 .reveal .slides > section > section[data-transition=zoom].past, 746 .reveal .slides > section > section[data-transition~=zoom-out].past, 747 .reveal.zoom .slides > section > section:not([data-transition]).past { 748 -webkit-transform: translate(0, -150%); 749 transform: translate(0, -150%); } 750 751 .reveal .slides > section > section[data-transition=zoom].future, 752 .reveal .slides > section > section[data-transition~=zoom-in].future, 753 .reveal.zoom .slides > section > section:not([data-transition]).future { 754 -webkit-transform: translate(0, 150%); 755 transform: translate(0, 150%); } 756 757 /********************************************* 758 * CUBE TRANSITION 759 * 760 * WARNING: 761 * this is deprecated and will be removed in a 762 * future version. 763 *********************************************/ 764 .reveal.cube .slides { 765 -webkit-perspective: 1300px; 766 perspective: 1300px; } 767 768 .reveal.cube .slides section { 769 padding: 30px; 770 min-height: 700px; 771 -webkit-backface-visibility: hidden; 772 backface-visibility: hidden; 773 box-sizing: border-box; 774 -webkit-transform-style: preserve-3d; 775 transform-style: preserve-3d; } 776 777 .reveal.center.cube .slides section { 778 min-height: 0; } 779 780 .reveal.cube .slides section:not(.stack):before { 781 content: ''; 782 position: absolute; 783 display: block; 784 width: 100%; 785 height: 100%; 786 left: 0; 787 top: 0; 788 background: rgba(0, 0, 0, 0.1); 789 border-radius: 4px; 790 -webkit-transform: translateZ(-20px); 791 transform: translateZ(-20px); } 792 793 .reveal.cube .slides section:not(.stack):after { 794 content: ''; 795 position: absolute; 796 display: block; 797 width: 90%; 798 height: 30px; 799 left: 5%; 800 bottom: 0; 801 background: none; 802 z-index: 1; 803 border-radius: 4px; 804 box-shadow: 0px 95px 25px rgba(0, 0, 0, 0.2); 805 -webkit-transform: translateZ(-90px) rotateX(65deg); 806 transform: translateZ(-90px) rotateX(65deg); } 807 808 .reveal.cube .slides > section.stack { 809 padding: 0; 810 background: none; } 811 812 .reveal.cube .slides > section.past { 813 -webkit-transform-origin: 100% 0%; 814 transform-origin: 100% 0%; 815 -webkit-transform: translate3d(-100%, 0, 0) rotateY(-90deg); 816 transform: translate3d(-100%, 0, 0) rotateY(-90deg); } 817 818 .reveal.cube .slides > section.future { 819 -webkit-transform-origin: 0% 0%; 820 transform-origin: 0% 0%; 821 -webkit-transform: translate3d(100%, 0, 0) rotateY(90deg); 822 transform: translate3d(100%, 0, 0) rotateY(90deg); } 823 824 .reveal.cube .slides > section > section.past { 825 -webkit-transform-origin: 0% 100%; 826 transform-origin: 0% 100%; 827 -webkit-transform: translate3d(0, -100%, 0) rotateX(90deg); 828 transform: translate3d(0, -100%, 0) rotateX(90deg); } 829 830 .reveal.cube .slides > section > section.future { 831 -webkit-transform-origin: 0% 0%; 832 transform-origin: 0% 0%; 833 -webkit-transform: translate3d(0, 100%, 0) rotateX(-90deg); 834 transform: translate3d(0, 100%, 0) rotateX(-90deg); } 835 836 /********************************************* 837 * PAGE TRANSITION 838 * 839 * WARNING: 840 * this is deprecated and will be removed in a 841 * future version. 842 *********************************************/ 843 .reveal.page .slides { 844 -webkit-perspective-origin: 0% 50%; 845 perspective-origin: 0% 50%; 846 -webkit-perspective: 3000px; 847 perspective: 3000px; } 848 849 .reveal.page .slides section { 850 padding: 30px; 851 min-height: 700px; 852 box-sizing: border-box; 853 -webkit-transform-style: preserve-3d; 854 transform-style: preserve-3d; } 855 856 .reveal.page .slides section.past { 857 z-index: 12; } 858 859 .reveal.page .slides section:not(.stack):before { 860 content: ''; 861 position: absolute; 862 display: block; 863 width: 100%; 864 height: 100%; 865 left: 0; 866 top: 0; 867 background: rgba(0, 0, 0, 0.1); 868 -webkit-transform: translateZ(-20px); 869 transform: translateZ(-20px); } 870 871 .reveal.page .slides section:not(.stack):after { 872 content: ''; 873 position: absolute; 874 display: block; 875 width: 90%; 876 height: 30px; 877 left: 5%; 878 bottom: 0; 879 background: none; 880 z-index: 1; 881 border-radius: 4px; 882 box-shadow: 0px 95px 25px rgba(0, 0, 0, 0.2); 883 -webkit-transform: translateZ(-90px) rotateX(65deg); } 884 885 .reveal.page .slides > section.stack { 886 padding: 0; 887 background: none; } 888 889 .reveal.page .slides > section.past { 890 -webkit-transform-origin: 0% 0%; 891 transform-origin: 0% 0%; 892 -webkit-transform: translate3d(-40%, 0, 0) rotateY(-80deg); 893 transform: translate3d(-40%, 0, 0) rotateY(-80deg); } 894 895 .reveal.page .slides > section.future { 896 -webkit-transform-origin: 100% 0%; 897 transform-origin: 100% 0%; 898 -webkit-transform: translate3d(0, 0, 0); 899 transform: translate3d(0, 0, 0); } 900 901 .reveal.page .slides > section > section.past { 902 -webkit-transform-origin: 0% 0%; 903 transform-origin: 0% 0%; 904 -webkit-transform: translate3d(0, -40%, 0) rotateX(80deg); 905 transform: translate3d(0, -40%, 0) rotateX(80deg); } 906 907 .reveal.page .slides > section > section.future { 908 -webkit-transform-origin: 0% 100%; 909 transform-origin: 0% 100%; 910 -webkit-transform: translate3d(0, 0, 0); 911 transform: translate3d(0, 0, 0); } 912 913 /********************************************* 914 * FADE TRANSITION 915 *********************************************/ 916 .reveal .slides section[data-transition=fade], 917 .reveal.fade .slides section:not([data-transition]), 918 .reveal.fade .slides > section > section:not([data-transition]) { 919 -webkit-transform: none; 920 transform: none; 921 transition: opacity 0.5s; } 922 923 .reveal.fade.overview .slides section, 924 .reveal.fade.overview .slides > section > section { 925 transition: none; } 926 927 /********************************************* 928 * NO TRANSITION 929 *********************************************/ 930 .reveal .slides section[data-transition=none], 931 .reveal.none .slides section:not([data-transition]) { 932 -webkit-transform: none; 933 transform: none; 934 transition: none; } 935 936 /********************************************* 937 * PAUSED MODE 938 *********************************************/ 939 .reveal .pause-overlay { 940 position: absolute; 941 top: 0; 942 left: 0; 943 width: 100%; 944 height: 100%; 945 background: black; 946 visibility: hidden; 947 opacity: 0; 948 z-index: 100; 949 transition: all 1s ease; } 950 951 .reveal.paused .pause-overlay { 952 visibility: visible; 953 opacity: 1; } 954 955 /********************************************* 956 * FALLBACK 957 *********************************************/ 958 .no-transforms { 959 overflow-y: auto; } 960 961 .no-transforms .reveal .slides { 962 position: relative; 963 width: 80%; 964 height: auto !important; 965 top: 0; 966 left: 50%; 967 margin: 0; 968 text-align: center; } 969 970 .no-transforms .reveal .controls, 971 .no-transforms .reveal .progress { 972 display: none !important; } 973 974 .no-transforms .reveal .slides section { 975 display: block !important; 976 opacity: 1 !important; 977 position: relative !important; 978 height: auto; 979 min-height: 0; 980 top: 0; 981 left: -50%; 982 margin: 70px 0; 983 -webkit-transform: none; 984 transform: none; } 985 986 .no-transforms .reveal .slides section section { 987 left: 0; } 988 989 .reveal .no-transition, 990 .reveal .no-transition * { 991 transition: none !important; } 992 993 /********************************************* 994 * PER-SLIDE BACKGROUNDS 995 *********************************************/ 996 .reveal .backgrounds { 997 position: absolute; 998 width: 100%; 999 height: 100%; 1000 top: 0; 1001 left: 0; 1002 -webkit-perspective: 600px; 1003 perspective: 600px; } 1004 1005 .reveal .slide-background { 1006 display: none; 1007 position: absolute; 1008 width: 100%; 1009 height: 100%; 1010 opacity: 0; 1011 visibility: hidden; 1012 overflow: hidden; 1013 background-color: transparent; 1014 background-position: 50% 50%; 1015 background-repeat: no-repeat; 1016 background-size: cover; 1017 transition: all 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); } 1018 1019 .reveal .slide-background.stack { 1020 display: block; } 1021 1022 .reveal .slide-background.present { 1023 opacity: 1; 1024 visibility: visible; 1025 z-index: 2; } 1026 1027 .print-pdf .reveal .slide-background { 1028 opacity: 1 !important; 1029 visibility: visible !important; } 1030 1031 /* Video backgrounds */ 1032 .reveal .slide-background video { 1033 position: absolute; 1034 width: 100%; 1035 height: 100%; 1036 max-width: none; 1037 max-height: none; 1038 top: 0; 1039 left: 0; 1040 -o-object-fit: cover; 1041 object-fit: cover; } 1042 1043 .reveal .slide-background[data-background-size="contain"] video { 1044 -o-object-fit: contain; 1045 object-fit: contain; } 1046 1047 /* Immediate transition style */ 1048 .reveal[data-background-transition=none] > .backgrounds .slide-background, 1049 .reveal > .backgrounds .slide-background[data-background-transition=none] { 1050 transition: none; } 1051 1052 /* Slide */ 1053 .reveal[data-background-transition=slide] > .backgrounds .slide-background, 1054 .reveal > .backgrounds .slide-background[data-background-transition=slide] { 1055 opacity: 1; 1056 -webkit-backface-visibility: hidden; 1057 backface-visibility: hidden; } 1058 1059 .reveal[data-background-transition=slide] > .backgrounds .slide-background.past, 1060 .reveal > .backgrounds .slide-background.past[data-background-transition=slide] { 1061 -webkit-transform: translate(-100%, 0); 1062 transform: translate(-100%, 0); } 1063 1064 .reveal[data-background-transition=slide] > .backgrounds .slide-background.future, 1065 .reveal > .backgrounds .slide-background.future[data-background-transition=slide] { 1066 -webkit-transform: translate(100%, 0); 1067 transform: translate(100%, 0); } 1068 1069 .reveal[data-background-transition=slide] > .backgrounds .slide-background > .slide-background.past, 1070 .reveal > .backgrounds .slide-background > .slide-background.past[data-background-transition=slide] { 1071 -webkit-transform: translate(0, -100%); 1072 transform: translate(0, -100%); } 1073 1074 .reveal[data-background-transition=slide] > .backgrounds .slide-background > .slide-background.future, 1075 .reveal > .backgrounds .slide-background > .slide-background.future[data-background-transition=slide] { 1076 -webkit-transform: translate(0, 100%); 1077 transform: translate(0, 100%); } 1078 1079 /* Convex */ 1080 .reveal[data-background-transition=convex] > .backgrounds .slide-background.past, 1081 .reveal > .backgrounds .slide-background.past[data-background-transition=convex] { 1082 opacity: 0; 1083 -webkit-transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); 1084 transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); } 1085 1086 .reveal[data-background-transition=convex] > .backgrounds .slide-background.future, 1087 .reveal > .backgrounds .slide-background.future[data-background-transition=convex] { 1088 opacity: 0; 1089 -webkit-transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); 1090 transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); } 1091 1092 .reveal[data-background-transition=convex] > .backgrounds .slide-background > .slide-background.past, 1093 .reveal > .backgrounds .slide-background > .slide-background.past[data-background-transition=convex] { 1094 opacity: 0; 1095 -webkit-transform: translate3d(0, -100%, 0) rotateX(90deg) translate3d(0, -100%, 0); 1096 transform: translate3d(0, -100%, 0) rotateX(90deg) translate3d(0, -100%, 0); } 1097 1098 .reveal[data-background-transition=convex] > .backgrounds .slide-background > .slide-background.future, 1099 .reveal > .backgrounds .slide-background > .slide-background.future[data-background-transition=convex] { 1100 opacity: 0; 1101 -webkit-transform: translate3d(0, 100%, 0) rotateX(-90deg) translate3d(0, 100%, 0); 1102 transform: translate3d(0, 100%, 0) rotateX(-90deg) translate3d(0, 100%, 0); } 1103 1104 /* Concave */ 1105 .reveal[data-background-transition=concave] > .backgrounds .slide-background.past, 1106 .reveal > .backgrounds .slide-background.past[data-background-transition=concave] { 1107 opacity: 0; 1108 -webkit-transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0); 1109 transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0); } 1110 1111 .reveal[data-background-transition=concave] > .backgrounds .slide-background.future, 1112 .reveal > .backgrounds .slide-background.future[data-background-transition=concave] { 1113 opacity: 0; 1114 -webkit-transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0); 1115 transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0); } 1116 1117 .reveal[data-background-transition=concave] > .backgrounds .slide-background > .slide-background.past, 1118 .reveal > .backgrounds .slide-background > .slide-background.past[data-background-transition=concave] { 1119 opacity: 0; 1120 -webkit-transform: translate3d(0, -100%, 0) rotateX(-90deg) translate3d(0, -100%, 0); 1121 transform: translate3d(0, -100%, 0) rotateX(-90deg) translate3d(0, -100%, 0); } 1122 1123 .reveal[data-background-transition=concave] > .backgrounds .slide-background > .slide-background.future, 1124 .reveal > .backgrounds .slide-background > .slide-background.future[data-background-transition=concave] { 1125 opacity: 0; 1126 -webkit-transform: translate3d(0, 100%, 0) rotateX(90deg) translate3d(0, 100%, 0); 1127 transform: translate3d(0, 100%, 0) rotateX(90deg) translate3d(0, 100%, 0); } 1128 1129 /* Zoom */ 1130 .reveal[data-background-transition=zoom] > .backgrounds .slide-background, 1131 .reveal > .backgrounds .slide-background[data-background-transition=zoom] { 1132 transition-timing-function: ease; } 1133 1134 .reveal[data-background-transition=zoom] > .backgrounds .slide-background.past, 1135 .reveal > .backgrounds .slide-background.past[data-background-transition=zoom] { 1136 opacity: 0; 1137 visibility: hidden; 1138 -webkit-transform: scale(16); 1139 transform: scale(16); } 1140 1141 .reveal[data-background-transition=zoom] > .backgrounds .slide-background.future, 1142 .reveal > .backgrounds .slide-background.future[data-background-transition=zoom] { 1143 opacity: 0; 1144 visibility: hidden; 1145 -webkit-transform: scale(0.2); 1146 transform: scale(0.2); } 1147 1148 .reveal[data-background-transition=zoom] > .backgrounds .slide-background > .slide-background.past, 1149 .reveal > .backgrounds .slide-background > .slide-background.past[data-background-transition=zoom] { 1150 opacity: 0; 1151 visibility: hidden; 1152 -webkit-transform: scale(16); 1153 transform: scale(16); } 1154 1155 .reveal[data-background-transition=zoom] > .backgrounds .slide-background > .slide-background.future, 1156 .reveal > .backgrounds .slide-background > .slide-background.future[data-background-transition=zoom] { 1157 opacity: 0; 1158 visibility: hidden; 1159 -webkit-transform: scale(0.2); 1160 transform: scale(0.2); } 1161 1162 /* Global transition speed settings */ 1163 .reveal[data-transition-speed="fast"] > .backgrounds .slide-background { 1164 transition-duration: 400ms; } 1165 1166 .reveal[data-transition-speed="slow"] > .backgrounds .slide-background { 1167 transition-duration: 1200ms; } 1168 1169 /********************************************* 1170 * OVERVIEW 1171 *********************************************/ 1172 .reveal.overview { 1173 -webkit-perspective-origin: 50% 50%; 1174 perspective-origin: 50% 50%; 1175 -webkit-perspective: 700px; 1176 perspective: 700px; } 1177 .reveal.overview .slides { 1178 -moz-transform-style: preserve-3d; } 1179 .reveal.overview .slides section { 1180 height: 100%; 1181 top: 0 !important; 1182 opacity: 1 !important; 1183 overflow: hidden; 1184 visibility: visible !important; 1185 cursor: pointer; 1186 box-sizing: border-box; } 1187 .reveal.overview .slides section:hover, 1188 .reveal.overview .slides section.present { 1189 outline: 10px solid rgba(150, 150, 150, 0.4); 1190 outline-offset: 10px; } 1191 .reveal.overview .slides section .fragment { 1192 opacity: 1; 1193 transition: none; } 1194 .reveal.overview .slides section:after, 1195 .reveal.overview .slides section:before { 1196 display: none !important; } 1197 .reveal.overview .slides > section.stack { 1198 padding: 0; 1199 top: 0 !important; 1200 background: none; 1201 outline: none; 1202 overflow: visible; } 1203 .reveal.overview .backgrounds { 1204 -webkit-perspective: inherit; 1205 perspective: inherit; 1206 -moz-transform-style: preserve-3d; } 1207 .reveal.overview .backgrounds .slide-background { 1208 opacity: 1; 1209 visibility: visible; 1210 outline: 10px solid rgba(150, 150, 150, 0.1); 1211 outline-offset: 10px; } 1212 .reveal.overview .backgrounds .slide-background.stack { 1213 overflow: visible; } 1214 1215 .reveal.overview .slides section, 1216 .reveal.overview-deactivating .slides section { 1217 transition: none; } 1218 1219 .reveal.overview .backgrounds .slide-background, 1220 .reveal.overview-deactivating .backgrounds .slide-background { 1221 transition: none; } 1222 1223 /********************************************* 1224 * RTL SUPPORT 1225 *********************************************/ 1226 .reveal.rtl .slides, 1227 .reveal.rtl .slides h1, 1228 .reveal.rtl .slides h2, 1229 .reveal.rtl .slides h3, 1230 .reveal.rtl .slides h4, 1231 .reveal.rtl .slides h5, 1232 .reveal.rtl .slides h6 { 1233 direction: rtl; 1234 font-family: sans-serif; } 1235 1236 .reveal.rtl pre, 1237 .reveal.rtl code { 1238 direction: ltr; } 1239 1240 .reveal.rtl ol, 1241 .reveal.rtl ul { 1242 text-align: right; } 1243 1244 .reveal.rtl .progress span { 1245 float: right; } 1246 1247 /********************************************* 1248 * PARALLAX BACKGROUND 1249 *********************************************/ 1250 .reveal.has-parallax-background .backgrounds { 1251 transition: all 0.8s ease; } 1252 1253 /* Global transition speed settings */ 1254 .reveal.has-parallax-background[data-transition-speed="fast"] .backgrounds { 1255 transition-duration: 400ms; } 1256 1257 .reveal.has-parallax-background[data-transition-speed="slow"] .backgrounds { 1258 transition-duration: 1200ms; } 1259 1260 /********************************************* 1261 * LINK PREVIEW OVERLAY 1262 *********************************************/ 1263 .reveal .overlay { 1264 position: absolute; 1265 top: 0; 1266 left: 0; 1267 width: 100%; 1268 height: 100%; 1269 z-index: 1000; 1270 background: rgba(0, 0, 0, 0.9); 1271 opacity: 0; 1272 visibility: hidden; 1273 transition: all 0.3s ease; } 1274 1275 .reveal .overlay.visible { 1276 opacity: 1; 1277 visibility: visible; } 1278 1279 .reveal .overlay .spinner { 1280 position: absolute; 1281 display: block; 1282 top: 50%; 1283 left: 50%; 1284 width: 32px; 1285 height: 32px; 1286 margin: -16px 0 0 -16px; 1287 z-index: 10; 1288 background-image: url(data:image/gif;base64,R0lGODlhIAAgAPMAAJmZmf%2F%2F%2F6%2Bvr8nJybW1tcDAwOjo6Nvb26ioqKOjo7Ozs%2FLy8vz8%2FAAAAAAAAAAAACH%2FC05FVFNDQVBFMi4wAwEAAAAh%2FhpDcmVhdGVkIHdpdGggYWpheGxvYWQuaW5mbwAh%2BQQJCgAAACwAAAAAIAAgAAAE5xDISWlhperN52JLhSSdRgwVo1ICQZRUsiwHpTJT4iowNS8vyW2icCF6k8HMMBkCEDskxTBDAZwuAkkqIfxIQyhBQBFvAQSDITM5VDW6XNE4KagNh6Bgwe60smQUB3d4Rz1ZBApnFASDd0hihh12BkE9kjAJVlycXIg7CQIFA6SlnJ87paqbSKiKoqusnbMdmDC2tXQlkUhziYtyWTxIfy6BE8WJt5YJvpJivxNaGmLHT0VnOgSYf0dZXS7APdpB309RnHOG5gDqXGLDaC457D1zZ%2FV%2FnmOM82XiHRLYKhKP1oZmADdEAAAh%2BQQJCgAAACwAAAAAIAAgAAAE6hDISWlZpOrNp1lGNRSdRpDUolIGw5RUYhhHukqFu8DsrEyqnWThGvAmhVlteBvojpTDDBUEIFwMFBRAmBkSgOrBFZogCASwBDEY%2FCZSg7GSE0gSCjQBMVG023xWBhklAnoEdhQEfyNqMIcKjhRsjEdnezB%2BA4k8gTwJhFuiW4dokXiloUepBAp5qaKpp6%2BHo7aWW54wl7obvEe0kRuoplCGepwSx2jJvqHEmGt6whJpGpfJCHmOoNHKaHx61WiSR92E4lbFoq%2BB6QDtuetcaBPnW6%2BO7wDHpIiK9SaVK5GgV543tzjgGcghAgAh%2BQQJCgAAACwAAAAAIAAgAAAE7hDISSkxpOrN5zFHNWRdhSiVoVLHspRUMoyUakyEe8PTPCATW9A14E0UvuAKMNAZKYUZCiBMuBakSQKG8G2FzUWox2AUtAQFcBKlVQoLgQReZhQlCIJesQXI5B0CBnUMOxMCenoCfTCEWBsJColTMANldx15BGs8B5wlCZ9Po6OJkwmRpnqkqnuSrayqfKmqpLajoiW5HJq7FL1Gr2mMMcKUMIiJgIemy7xZtJsTmsM4xHiKv5KMCXqfyUCJEonXPN2rAOIAmsfB3uPoAK%2B%2BG%2Bw48edZPK%2BM6hLJpQg484enXIdQFSS1u6UhksENEQAAIfkECQoAAAAsAAAAACAAIAAABOcQyEmpGKLqzWcZRVUQnZYg1aBSh2GUVEIQ2aQOE%2BG%2BcD4ntpWkZQj1JIiZIogDFFyHI0UxQwFugMSOFIPJftfVAEoZLBbcLEFhlQiqGp1Vd140AUklUN3eCA51C1EWMzMCezCBBmkxVIVHBWd3HHl9JQOIJSdSnJ0TDKChCwUJjoWMPaGqDKannasMo6WnM562R5YluZRwur0wpgqZE7NKUm%2BFNRPIhjBJxKZteWuIBMN4zRMIVIhffcgojwCF117i4nlLnY5ztRLsnOk%2BaV%2BoJY7V7m76PdkS4trKcdg0Zc0tTcKkRAAAIfkECQoAAAAsAAAAACAAIAAABO4QyEkpKqjqzScpRaVkXZWQEximw1BSCUEIlDohrft6cpKCk5xid5MNJTaAIkekKGQkWyKHkvhKsR7ARmitkAYDYRIbUQRQjWBwJRzChi9CRlBcY1UN4g0%2FVNB0AlcvcAYHRyZPdEQFYV8ccwR5HWxEJ02YmRMLnJ1xCYp0Y5idpQuhopmmC2KgojKasUQDk5BNAwwMOh2RtRq5uQuPZKGIJQIGwAwGf6I0JXMpC8C7kXWDBINFMxS4DKMAWVWAGYsAdNqW5uaRxkSKJOZKaU3tPOBZ4DuK2LATgJhkPJMgTwKCdFjyPHEnKxFCDhEAACH5BAkKAAAALAAAAAAgACAAAATzEMhJaVKp6s2nIkolIJ2WkBShpkVRWqqQrhLSEu9MZJKK9y1ZrqYK9WiClmvoUaF8gIQSNeF1Er4MNFn4SRSDARWroAIETg1iVwuHjYB1kYc1mwruwXKC9gmsJXliGxc%2BXiUCby9ydh1sOSdMkpMTBpaXBzsfhoc5l58Gm5yToAaZhaOUqjkDgCWNHAULCwOLaTmzswadEqggQwgHuQsHIoZCHQMMQgQGubVEcxOPFAcMDAYUA85eWARmfSRQCdcMe0zeP1AAygwLlJtPNAAL19DARdPzBOWSm1brJBi45soRAWQAAkrQIykShQ9wVhHCwCQCACH5BAkKAAAALAAAAAAgACAAAATrEMhJaVKp6s2nIkqFZF2VIBWhUsJaTokqUCoBq%2BE71SRQeyqUToLA7VxF0JDyIQh%2FMVVPMt1ECZlfcjZJ9mIKoaTl1MRIl5o4CUKXOwmyrCInCKqcWtvadL2SYhyASyNDJ0uIiRMDjI0Fd30%2FiI2UA5GSS5UDj2l6NoqgOgN4gksEBgYFf0FDqKgHnyZ9OX8HrgYHdHpcHQULXAS2qKpENRg7eAMLC7kTBaixUYFkKAzWAAnLC7FLVxLWDBLKCwaKTULgEwbLA4hJtOkSBNqITT3xEgfLpBtzE%2FjiuL04RGEBgwWhShRgQExHBAAh%2BQQJCgAAACwAAAAAIAAgAAAE7xDISWlSqerNpyJKhWRdlSAVoVLCWk6JKlAqAavhO9UkUHsqlE6CwO1cRdCQ8iEIfzFVTzLdRAmZX3I2SfZiCqGk5dTESJeaOAlClzsJsqwiJwiqnFrb2nS9kmIcgEsjQydLiIlHehhpejaIjzh9eomSjZR%2BipslWIRLAgMDOR2DOqKogTB9pCUJBagDBXR6XB0EBkIIsaRsGGMMAxoDBgYHTKJiUYEGDAzHC9EACcUGkIgFzgwZ0QsSBcXHiQvOwgDdEwfFs0sDzt4S6BK4xYjkDOzn0unFeBzOBijIm1Dgmg5YFQwsCMjp1oJ8LyIAACH5BAkKAAAALAAAAAAgACAAAATwEMhJaVKp6s2nIkqFZF2VIBWhUsJaTokqUCoBq%2BE71SRQeyqUToLA7VxF0JDyIQh%2FMVVPMt1ECZlfcjZJ9mIKoaTl1MRIl5o4CUKXOwmyrCInCKqcWtvadL2SYhyASyNDJ0uIiUd6GGl6NoiPOH16iZKNlH6KmyWFOggHhEEvAwwMA0N9GBsEC6amhnVcEwavDAazGwIDaH1ipaYLBUTCGgQDA8NdHz0FpqgTBwsLqAbWAAnIA4FWKdMLGdYGEgraigbT0OITBcg5QwPT4xLrROZL6AuQAPUS7bxLpoWidY0JtxLHKhwwMJBTHgPKdEQAACH5BAkKAAAALAAAAAAgACAAAATrEMhJaVKp6s2nIkqFZF2VIBWhUsJaTokqUCoBq%2BE71SRQeyqUToLA7VxF0JDyIQh%2FMVVPMt1ECZlfcjZJ9mIKoaTl1MRIl5o4CUKXOwmyrCInCKqcWtvadL2SYhyASyNDJ0uIiUd6GAULDJCRiXo1CpGXDJOUjY%2BYip9DhToJA4RBLwMLCwVDfRgbBAaqqoZ1XBMHswsHtxtFaH1iqaoGNgAIxRpbFAgfPQSqpbgGBqUD1wBXeCYp1AYZ19JJOYgH1KwA4UBvQwXUBxPqVD9L3sbp2BNk2xvvFPJd%2BMFCN6HAAIKgNggY0KtEBAAh%2BQQJCgAAACwAAAAAIAAgAAAE6BDISWlSqerNpyJKhWRdlSAVoVLCWk6JKlAqAavhO9UkUHsqlE6CwO1cRdCQ8iEIfzFVTzLdRAmZX3I2SfYIDMaAFdTESJeaEDAIMxYFqrOUaNW4E4ObYcCXaiBVEgULe0NJaxxtYksjh2NLkZISgDgJhHthkpU4mW6blRiYmZOlh4JWkDqILwUGBnE6TYEbCgevr0N1gH4At7gHiRpFaLNrrq8HNgAJA70AWxQIH1%2BvsYMDAzZQPC9VCNkDWUhGkuE5PxJNwiUK4UfLzOlD4WvzAHaoG9nxPi5d%2BjYUqfAhhykOFwJWiAAAIfkECQoAAAAsAAAAACAAIAAABPAQyElpUqnqzaciSoVkXVUMFaFSwlpOCcMYlErAavhOMnNLNo8KsZsMZItJEIDIFSkLGQoQTNhIsFehRww2CQLKF0tYGKYSg%2BygsZIuNqJksKgbfgIGepNo2cIUB3V1B3IvNiBYNQaDSTtfhhx0CwVPI0UJe0%2Bbm4g5VgcGoqOcnjmjqDSdnhgEoamcsZuXO1aWQy8KAwOAuTYYGwi7w5h%2BKr0SJ8MFihpNbx%2B4Erq7BYBuzsdiH1jCAzoSfl0rVirNbRXlBBlLX%2BBP0XJLAPGzTkAuAOqb0WT5AH7OcdCm5B8TgRwSRKIHQtaLCwg1RAAAOwAAAAAAAAAAAA%3D%3D); 1289 visibility: visible; 1290 opacity: 0.6; 1291 transition: all 0.3s ease; } 1292 1293 .reveal .overlay header { 1294 position: absolute; 1295 left: 0; 1296 top: 0; 1297 width: 100%; 1298 height: 40px; 1299 z-index: 2; 1300 border-bottom: 1px solid #222; } 1301 1302 .reveal .overlay header a { 1303 display: inline-block; 1304 width: 40px; 1305 height: 40px; 1306 line-height: 36px; 1307 padding: 0 10px; 1308 float: right; 1309 opacity: 0.6; 1310 box-sizing: border-box; } 1311 1312 .reveal .overlay header a:hover { 1313 opacity: 1; } 1314 1315 .reveal .overlay header a .icon { 1316 display: inline-block; 1317 width: 20px; 1318 height: 20px; 1319 background-position: 50% 50%; 1320 background-size: 100%; 1321 background-repeat: no-repeat; } 1322 1323 .reveal .overlay header a.close .icon { 1324 background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAABkklEQVRYR8WX4VHDMAxG6wnoJrABZQPYBCaBTWAD2g1gE5gg6OOsXuxIlr40d81dfrSJ9V4c2VLK7spHuTJ/5wpM07QXuXc5X0opX2tEJcadjHuV80li/FgxTIEK/5QBCICBD6xEhSMGHgQPgBgLiYVAB1dpSqKDawxTohFw4JSEA3clzgIBPCURwE2JucBR7rhPJJv5OpJwDX+SfDjgx1wACQeJG1aChP9K/IMmdZ8DtESV1WyP3Bt4MwM6sj4NMxMYiqUWHQu4KYA/SYkIjOsm3BXYWMKFDwU2khjCQ4ELJUJ4SmClRArOCmSXGuKma0fYD5CbzHxFpCSGAhfAVSSUGDUk2BWZaff2g6GE15BsBQ9nwmpIGDiyHQddwNTMKkbZaf9fajXQca1EX44puJZUsnY0ObGmITE3GVLCbEhQUjGVt146j6oasWN+49Vph2w1pZ5EansNZqKBm1txbU57iRRcZ86RWMDdWtBJUHBHwoQPi1GV+JCbntmvok7iTX4/Up9mgyTc/FJYDTcndgH/AA5A/CHsyEkVAAAAAElFTkSuQmCC); } 1325 1326 .reveal .overlay header a.external .icon { 1327 background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAcElEQVRYR+2WSQoAIQwEzf8f7XiOMkUQxUPlGkM3hVmiQfQR9GYnH1SsAQlI4DiBqkCMoNb9y2e90IAEJPAcgdznU9+engMaeJ7Azh5Y1U67gAho4DqBqmB1buAf0MB1AlVBek83ZPkmJMGc1wAR+AAqod/B97TRpQAAAABJRU5ErkJggg==); } 1328 1329 .reveal .overlay .viewport { 1330 position: absolute; 1331 display: -webkit-box; 1332 display: -ms-flexbox; 1333 display: flex; 1334 top: 40px; 1335 right: 0; 1336 bottom: 0; 1337 left: 0; } 1338 1339 .reveal .overlay.overlay-preview .viewport iframe { 1340 width: 100%; 1341 height: 100%; 1342 max-width: 100%; 1343 max-height: 100%; 1344 border: 0; 1345 opacity: 0; 1346 visibility: hidden; 1347 transition: all 0.3s ease; } 1348 1349 .reveal .overlay.overlay-preview.loaded .viewport iframe { 1350 opacity: 1; 1351 visibility: visible; } 1352 1353 .reveal .overlay.overlay-preview.loaded .viewport-inner { 1354 position: absolute; 1355 z-index: -1; 1356 left: 0; 1357 top: 45%; 1358 width: 100%; 1359 text-align: center; 1360 letter-spacing: normal; } 1361 1362 .reveal .overlay.overlay-preview .x-frame-error { 1363 opacity: 0; 1364 transition: opacity 0.3s ease 0.3s; } 1365 1366 .reveal .overlay.overlay-preview.loaded .x-frame-error { 1367 opacity: 1; } 1368 1369 .reveal .overlay.overlay-preview.loaded .spinner { 1370 opacity: 0; 1371 visibility: hidden; 1372 -webkit-transform: scale(0.2); 1373 transform: scale(0.2); } 1374 1375 .reveal .overlay.overlay-help .viewport { 1376 overflow: auto; 1377 color: #fff; } 1378 1379 .reveal .overlay.overlay-help .viewport .viewport-inner { 1380 width: 600px; 1381 margin: auto; 1382 padding: 20px 20px 80px 20px; 1383 text-align: center; 1384 letter-spacing: normal; } 1385 1386 .reveal .overlay.overlay-help .viewport .viewport-inner .title { 1387 font-size: 20px; } 1388 1389 .reveal .overlay.overlay-help .viewport .viewport-inner table { 1390 border: 1px solid #fff; 1391 border-collapse: collapse; 1392 font-size: 16px; } 1393 1394 .reveal .overlay.overlay-help .viewport .viewport-inner table th, 1395 .reveal .overlay.overlay-help .viewport .viewport-inner table td { 1396 width: 200px; 1397 padding: 14px; 1398 border: 1px solid #fff; 1399 vertical-align: middle; } 1400 1401 .reveal .overlay.overlay-help .viewport .viewport-inner table th { 1402 padding-top: 20px; 1403 padding-bottom: 20px; } 1404 1405 /********************************************* 1406 * PLAYBACK COMPONENT 1407 *********************************************/ 1408 .reveal .playback { 1409 position: absolute; 1410 left: 15px; 1411 bottom: 20px; 1412 z-index: 30; 1413 cursor: pointer; 1414 transition: all 400ms ease; 1415 -webkit-tap-highlight-color: transparent; } 1416 1417 .reveal.overview .playback { 1418 opacity: 0; 1419 visibility: hidden; } 1420 1421 /********************************************* 1422 * ROLLING LINKS 1423 *********************************************/ 1424 .reveal .roll { 1425 display: inline-block; 1426 line-height: 1.2; 1427 overflow: hidden; 1428 vertical-align: top; 1429 -webkit-perspective: 400px; 1430 perspective: 400px; 1431 -webkit-perspective-origin: 50% 50%; 1432 perspective-origin: 50% 50%; } 1433 1434 .reveal .roll:hover { 1435 background: none; 1436 text-shadow: none; } 1437 1438 .reveal .roll span { 1439 display: block; 1440 position: relative; 1441 padding: 0 2px; 1442 pointer-events: none; 1443 transition: all 400ms ease; 1444 -webkit-transform-origin: 50% 0%; 1445 transform-origin: 50% 0%; 1446 -webkit-transform-style: preserve-3d; 1447 transform-style: preserve-3d; 1448 -webkit-backface-visibility: hidden; 1449 backface-visibility: hidden; } 1450 1451 .reveal .roll:hover span { 1452 background: rgba(0, 0, 0, 0.5); 1453 -webkit-transform: translate3d(0px, 0px, -45px) rotateX(90deg); 1454 transform: translate3d(0px, 0px, -45px) rotateX(90deg); } 1455 1456 .reveal .roll span:after { 1457 content: attr(data-title); 1458 display: block; 1459 position: absolute; 1460 left: 0; 1461 top: 0; 1462 padding: 0 2px; 1463 -webkit-backface-visibility: hidden; 1464 backface-visibility: hidden; 1465 -webkit-transform-origin: 50% 0%; 1466 transform-origin: 50% 0%; 1467 -webkit-transform: translate3d(0px, 110%, 0px) rotateX(-90deg); 1468 transform: translate3d(0px, 110%, 0px) rotateX(-90deg); } 1469 1470 /********************************************* 1471 * SPEAKER NOTES 1472 *********************************************/ 1473 .reveal aside.notes { 1474 display: none; } 1475 1476 .reveal .speaker-notes { 1477 display: none; 1478 position: absolute; 1479 width: 25vw; 1480 height: 100%; 1481 top: 0; 1482 left: 100%; 1483 padding: 14px 18px 14px 18px; 1484 z-index: 1; 1485 font-size: 18px; 1486 line-height: 1.4; 1487 border: 1px solid rgba(0, 0, 0, 0.05); 1488 color: #222; 1489 background-color: #f5f5f5; 1490 overflow: auto; 1491 box-sizing: border-box; 1492 text-align: left; 1493 font-family: Helvetica, sans-serif; 1494 -webkit-overflow-scrolling: touch; } 1495 .reveal .speaker-notes .notes-placeholder { 1496 color: #ccc; 1497 font-style: italic; } 1498 .reveal .speaker-notes:focus { 1499 outline: none; } 1500 .reveal .speaker-notes:before { 1501 content: 'Speaker notes'; 1502 display: block; 1503 margin-bottom: 10px; 1504 opacity: 0.5; } 1505 1506 .reveal.show-notes { 1507 max-width: 75vw; 1508 overflow: visible; } 1509 1510 .reveal.show-notes .speaker-notes { 1511 display: block; } 1512 1513 @media screen and (min-width: 1600px) { 1514 .reveal .speaker-notes { 1515 font-size: 20px; } } 1516 1517 @media screen and (max-width: 1024px) { 1518 .reveal.show-notes { 1519 border-left: 0; 1520 max-width: none; 1521 max-height: 70%; 1522 overflow: visible; } 1523 .reveal.show-notes .speaker-notes { 1524 top: 100%; 1525 left: 0; 1526 width: 100%; 1527 height: 42.8571428571%; } } 1528 1529 @media screen and (max-width: 600px) { 1530 .reveal.show-notes { 1531 max-height: 60%; } 1532 .reveal.show-notes .speaker-notes { 1533 top: 100%; 1534 height: 66.6666666667%; } 1535 .reveal .speaker-notes { 1536 font-size: 14px; } } 1537 1538 /********************************************* 1539 * ZOOM PLUGIN 1540 *********************************************/ 1541 .zoomed .reveal *, 1542 .zoomed .reveal *:before, 1543 .zoomed .reveal *:after { 1544 -webkit-backface-visibility: visible !important; 1545 backface-visibility: visible !important; } 1546 1547 .zoomed .reveal .progress, 1548 .zoomed .reveal .controls { 1549 opacity: 0; } 1550 1551 .zoomed .reveal .roll span { 1552 background: none; } 1553 1554 .zoomed .reveal .roll span:after { 1555 visibility: hidden; }