reveal.scss 40.6 KB
Newer Older
1
2
3
4
5
/*!
 * reveal.js
 * http://lab.hakim.se/reveal-js
 * MIT licensed
 *
Hakim El Hattab's avatar
2017    
Hakim El Hattab committed
6
 * Copyright (C) 2017 Hakim El Hattab, http://hakim.se
7
8
9
10
11
12
13
14
15
16
17
18
 */


/*********************************************
 * RESET STYLES
 *********************************************/

html, body, .reveal div, .reveal span, .reveal applet, .reveal object, .reveal iframe,
.reveal h1, .reveal h2, .reveal h3, .reveal h4, .reveal h5, .reveal h6, .reveal p, .reveal blockquote, .reveal pre,
.reveal a, .reveal abbr, .reveal acronym, .reveal address, .reveal big, .reveal cite, .reveal code,
.reveal del, .reveal dfn, .reveal em, .reveal img, .reveal ins, .reveal kbd, .reveal q, .reveal s, .reveal samp,
.reveal small, .reveal strike, .reveal strong, .reveal sub, .reveal sup, .reveal tt, .reveal var,
Yves Delley's avatar
Yves Delley committed
19
.reveal b, .reveal u, .reveal center,
20
21
22
23
24
25
.reveal dl, .reveal dt, .reveal dd, .reveal ol, .reveal ul, .reveal li,
.reveal fieldset, .reveal form, .reveal label, .reveal legend,
.reveal table, .reveal caption, .reveal tbody, .reveal tfoot, .reveal thead, .reveal tr, .reveal th, .reveal td,
.reveal article, .reveal aside, .reveal canvas, .reveal details, .reveal embed,
.reveal figure, .reveal figcaption, .reveal footer, .reveal header, .reveal hgroup,
.reveal menu, .reveal nav, .reveal output, .reveal ruby, .reveal section, .reveal summary,
26
.reveal time, .reveal mark, .reveal audio, .reveal video {
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

.reveal article, .reveal aside, .reveal details, .reveal figcaption, .reveal figure,
.reveal footer, .reveal header, .reveal hgroup, .reveal menu, .reveal nav, .reveal section {
	display: block;
}


/*********************************************
 * GLOBAL STYLES
 *********************************************/

html,
body {
	width: 100%;
	height: 100%;
	overflow: hidden;
}

body {
	position: relative;
	line-height: 1;
Yves Delley's avatar
Yves Delley committed
55
56
57

	background-color: #fff;
	color: #000;
58
59
60
61
62
63
64
65
66
}


/*********************************************
 * VIEW FRAGMENTS
 *********************************************/

.reveal .slides section .fragment {
	opacity: 0;
Yves Delley's avatar
Yves Delley committed
67
	visibility: hidden;
68
	transition: all .2s ease;
69
70

	&.visible {
71
		opacity: 1;
72
		visibility: inherit;
73
	}
74
}
75
76
77

.reveal .slides section .fragment.grow {
	opacity: 1;
78
	visibility: inherit;
79
80

	&.visible {
81
		transform: scale( 1.3 );
82
	}
83
}
84
85
86

.reveal .slides section .fragment.shrink {
	opacity: 1;
87
	visibility: inherit;
88
89

	&.visible {
90
		transform: scale( 0.7 );
91
	}
92
}
93
94

.reveal .slides section .fragment.zoom-in {
95
	transform: scale( 0.1 );
96

97
	&.visible {
98
		transform: none;
99
	}
100
}
101
102
103

.reveal .slides section .fragment.fade-out {
	opacity: 1;
104
	visibility: inherit;
105
106

	&.visible {
107
		opacity: 0;
Yves Delley's avatar
Yves Delley committed
108
		visibility: hidden;
109
	}
110
}
111
112
113

.reveal .slides section .fragment.semi-fade-out {
	opacity: 1;
114
	visibility: inherit;
115
116

	&.visible {
117
		opacity: 0.5;
118
		visibility: inherit;
119
	}
120
121
122
123
}

.reveal .slides section .fragment.strike {
	opacity: 1;
124
	visibility: inherit;
125
126
127
128
129

	&.visible {
		text-decoration: line-through;
	}
}
130

131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
.reveal .slides section .fragment.fade-up {
	transform: translate(0, 20%);

	&.visible {
		transform: translate(0, 0);
	}
}

.reveal .slides section .fragment.fade-down {
	transform: translate(0, -20%);

	&.visible {
		transform: translate(0, 0);
	}
}

.reveal .slides section .fragment.fade-right {
	transform: translate(-20%, 0);

	&.visible {
		transform: translate(0, 0);
	}
}

.reveal .slides section .fragment.fade-left {
	transform: translate(20%, 0);

	&.visible {
		transform: translate(0, 0);
	}
}

163
.reveal .slides section .fragment.current-visible {
Yves Delley's avatar
Yves Delley committed
164
165
	opacity: 0;
	visibility: hidden;
166
167

	&.current-fragment {
Yves Delley's avatar
Yves Delley committed
168
		opacity: 1;
169
		visibility: inherit;
Yves Delley's avatar
Yves Delley committed
170
	}
171
}
172
173
174
175
176
177
178
179

.reveal .slides section .fragment.highlight-red,
.reveal .slides section .fragment.highlight-current-red,
.reveal .slides section .fragment.highlight-green,
.reveal .slides section .fragment.highlight-current-green,
.reveal .slides section .fragment.highlight-blue,
.reveal .slides section .fragment.highlight-current-blue {
	opacity: 1;
180
	visibility: inherit;
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
}
	.reveal .slides section .fragment.highlight-red.visible {
		color: #ff2c2d
	}
	.reveal .slides section .fragment.highlight-green.visible {
		color: #17ff2e;
	}
	.reveal .slides section .fragment.highlight-blue.visible {
		color: #1b91ff;
	}

.reveal .slides section .fragment.highlight-current-red.current-fragment {
	color: #ff2c2d
}
.reveal .slides section .fragment.highlight-current-green.current-fragment {
	color: #17ff2e;
}
.reveal .slides section .fragment.highlight-current-blue.current-fragment {
	color: #1b91ff;
}


/*********************************************
 * DEFAULT ELEMENT STYLES
 *********************************************/

/* Fixes issue in Chrome where italic fonts did not appear when printing to PDF */
.reveal:after {
  content: '';
  font-style: italic;
}

.reveal iframe {
	z-index: 1;
}

/** Prevents layering issues in certain browser/transition combinations */
.reveal a {
	position: relative;
}

Yves Delley's avatar
Yves Delley committed
222
223
224
.reveal .stretch {
	max-width: none;
	max-height: none;
225
226
227
228
229
}

.reveal pre.stretch code {
	height: 100%;
	max-height: 100%;
230
	box-sizing: border-box;
231
232
233
234
235
236
237
}


/*********************************************
 * CONTROLS
 *********************************************/

238
.reveal .controls {
239
240
	$size: 46px;
	$length: floor($size * 0.7);
241
	$thickness: 6px;
Hakim El Hattab's avatar
Hakim El Hattab committed
242
243
244
	$angle: 44deg;
	$angleHover: 40deg;
	$angleActive: 36deg;
245
246
	$spacing: 12px;
	$innerSpacing: 18px;
247

248
	@mixin arrowTransform( $angle ) {
249
		&:before {
Hakim El Hattab's avatar
Hakim El Hattab committed
250
			transform: translateX(($size - $length)/2) translateY(($size - $thickness)/2) rotate( $angle );
251
252
253
		}

		&:after {
Hakim El Hattab's avatar
Hakim El Hattab committed
254
			transform: translateX(($size - $length)/2) translateY(($size - $thickness)/2) rotate( -$angle );
255
		}
256
257
258
259
	}

	display: none;
	position: absolute;
260
261
262
263
	top: auto;
	bottom: $spacing;
	right: $spacing;
	left: auto;
264
	z-index: 1;
265
	color: #fff;
266
	pointer-events: none;
267
268
269
270
271
272
273
274
275
276

	button {
		position: absolute;
		padding: 0;
		width: $size;
		height: $size;
		background-color: transparent;
		border: 0;
		outline: 0;
		cursor: pointer;
277
		color: currentColor;
278
279
280
		transform: scale(.9999);
		transition: all 0.2s ease;
		z-index: 2; // above slides
281
		pointer-events: auto;
282
283
284
285

		visibility: hidden;
		opacity: 0;

286
287
288
289
290
291
292
293
		-webkit-appearance: none;
		-webkit-tap-highlight-color: rgba( 0, 0, 0, 0 );
	}

	button:before,
	button:after {
		content: '';
		position: absolute;
294
		top: 0;
295
		left: 0;
296
		width: $length;
297
		height: $thickness;
298
		border-radius: $thickness/2;
299
		background-color: currentColor;
300

301
		transition: all 0.15s ease, background-color 0.8s ease;
302
		transform-origin: $thickness/2 50%;
Hakim El Hattab's avatar
Hakim El Hattab committed
303
		will-change: transform;
304
305
306
	}

	button {
307
		@include arrowTransform( $angle );
308
309

		&:hover {
310
			@include arrowTransform( $angleHover );
311
312
313
		}

		&:active {
314
			@include arrowTransform( $angleActive );
315
316
317
318
		}
	}

	.navigate-left {
319
320
		right: $size + $innerSpacing*2;
		bottom: $innerSpacing;
321
		transform: translateY(-50%);
322
323
324
	}

	.navigate-right {
325
326
		right: 0;
		bottom: $innerSpacing;
327
		transform: translateY(-50%) rotate( 180deg );
328
329
330
	}

	.navigate-up {
331
332
		right: $innerSpacing;
		bottom: $size + $innerSpacing*2;
333
		transform: translateX(-50%) rotate( 90deg );
334
335
336
	}

	.navigate-down {
337
338
		right: $innerSpacing;
		bottom: 0;
339
		transform: translateX(-50%) rotate( -90deg );
340
	}
341

342
	// Back arrow style: "faded":
343
344
	// Strongly deemphasizes backwards navigation in favor of drawing
	// attention to forwards navigation
345
346
	&[data-controls-back-arrows="faded"] .navigate-left.enabled,
	&[data-controls-back-arrows="faded"] .navigate-up.enabled {
347
348
349
350
351
352
353
		opacity: 0.3;

		&:hover {
			opacity: 1;
		}
	}

354
355
356
357
358
359
360
361
	// Back arrow style: "hidden":
	// Never shows any arrows for backwards navigation
	&[data-controls-back-arrows="hidden"] .navigate-left.enabled,
	&[data-controls-back-arrows="hidden"] .navigate-up.enabled {
		opacity: 0;
		visibility: hidden;
	}

362
363
	// Any control button that can be clicked is "enabled"
	.enabled {
364
		visibility: visible;
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
		opacity: 0.7;
		cursor: pointer;
	}

	// Any control button that leads to showing or hiding
	// a fragment
	.enabled.fragmented {
		opacity: 0.3;
	}

	.enabled:hover,
	.enabled.fragmented:hover {
		opacity: 1;
	}

380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
	@media screen and (min-width: 500px) {

		$spacing: 8px;

		&[data-controls-layout="edges"] {
			& {
				top: 0;
				right: 0;
				bottom: 0;
				left: 0;
			}

			.navigate-left,
			.navigate-right,
			.navigate-up,
			.navigate-down {
				bottom: auto;
				right: auto;
			}

			.navigate-left {
				top: 50%;
				left: $spacing;
			}

			.navigate-right {
				top: 50%;
				right: $spacing;
			}

			.navigate-up {
				top: $spacing;
				left: 50%;
			}

			.navigate-down {
				bottom: $spacing;
				left: 50%;
			}
419
420
		}

421
	}
422
}
423

424
425
426
427
428
// Adjust the layout when there are no vertical slides
.reveal:not(.has-vertical-slides) .controls .navigate-left,
.reveal:not(.has-vertical-slides) .controls .navigate-right {
	bottom: 0;
}
429

430
431
432
.reveal:not(.has-horizontal-slides) .controls .navigate-up,
.reveal:not(.has-horizontal-slides) .controls .navigate-down {
	right: 0;
433
}
434

435
436
.reveal.has-dark-background .controls button:after,
.reveal.has-dark-background .controls button:before {
437
438
439
	background-color: #fff;
}

440
441
.reveal.has-light-background .controls button:after,
.reveal.has-light-background .controls button:before {
442
443
444
	background-color: #000;
}

445
446
447
448
449
450
451
452
453
454
455
456
457

/*********************************************
 * PROGRESS BAR
 *********************************************/

.reveal .progress {
	position: fixed;
	display: none;
	height: 3px;
	width: 100%;
	bottom: 0;
	left: 0;
	z-index: 10;
Yves Delley's avatar
Yves Delley committed
458
459

	background-color: rgba( 0, 0, 0, 0.2 );
460
461
462
}
	.reveal .progress:after {
		content: '';
Yves Delley's avatar
Yves Delley committed
463
		display: block;
464
		position: absolute;
Hakim El Hattab's avatar
Hakim El Hattab committed
465
		height: 10px;
466
		width: 100%;
Hakim El Hattab's avatar
Hakim El Hattab committed
467
		top: -10px;
468
469
470
471
472
	}
	.reveal .progress span {
		display: block;
		height: 100%;
		width: 0px;
Yves Delley's avatar
Yves Delley committed
473
474

		background-color: #000;
475
		transition: width 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985);
476
477
478
479
480
481
482
483
484
	}

/*********************************************
 * SLIDE NUMBER
 *********************************************/

.reveal .slide-number {
	position: fixed;
	display: block;
485
486
	right: 8px;
	bottom: 8px;
487
	z-index: 31;
Hakim El Hattab's avatar
Hakim El Hattab committed
488
	font-family: Helvetica, sans-serif;
489
	font-size: 12px;
Hakim El Hattab's avatar
Hakim El Hattab committed
490
	line-height: 1;
491
	color: #fff;
Hakim El Hattab's avatar
Hakim El Hattab committed
492
	background-color: rgba( 0, 0, 0, 0.4 );
493
	padding: 5px;
494
495
}

Hakim El Hattab's avatar
Hakim El Hattab committed
496
.reveal .slide-number-delimiter {
497
	margin: 0 3px;
Hakim El Hattab's avatar
Hakim El Hattab committed
498
499
}

500
501
502
503
504
505
506
507
/*********************************************
 * SLIDES
 *********************************************/

.reveal {
	position: relative;
	width: 100%;
	height: 100%;
508
	overflow: hidden;
Yves Delley's avatar
Yves Delley committed
509
	touch-action: none;
510
511
512
513
514
515
}

.reveal .slides {
	position: absolute;
	width: 100%;
	height: 100%;
Yves Delley's avatar
Yves Delley committed
516
517
518
519
520
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
521
	pointer-events: none;
522
523
524
525

	overflow: visible;
	z-index: 1;
	text-align: center;
526
527
	perspective: 600px;
	perspective-origin: 50% 40%;
528
529
530
531
532
533
534
535
536
537
538
539
}

.reveal .slides>section {
	-ms-perspective: 600px;
}

.reveal .slides>section,
.reveal .slides>section>section {
	display: none;
	position: absolute;
	width: 100%;
	padding: 20px 0px;
540
	pointer-events: auto;
541
542

	z-index: 10;
543
	transform-style: flat;
544
	transition: transform-origin 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985),
545
546
547
				transform 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985),
				visibility 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985),
				opacity 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985);
548
549
550
551
}

/* Global transition speed settings */
.reveal[data-transition-speed="fast"] .slides section {
552
	transition-duration: 400ms;
553
554
}
.reveal[data-transition-speed="slow"] .slides section {
555
	transition-duration: 1200ms;
556
557
558
559
}

/* Slide-specific transition speed overrides */
.reveal .slides section[data-transition-speed="fast"] {
560
	transition-duration: 400ms;
561
562
}
.reveal .slides section[data-transition-speed="slow"] {
563
	transition-duration: 1200ms;
564
565
566
567
568
569
570
571
572
573
574
575
576
577
}

.reveal .slides>section.stack {
	padding-top: 0;
	padding-bottom: 0;
}

.reveal .slides>section.present,
.reveal .slides>section>section.present {
	display: block;
	z-index: 11;
	opacity: 1;
}

578
.reveal .slides>section:empty,
Hakim El Hattab's avatar
Hakim El Hattab committed
579
580
581
.reveal .slides>section>section:empty,
.reveal .slides>section[data-background-interactive],
.reveal .slides>section>section[data-background-interactive] {
582
583
584
	pointer-events: none;
}

585
586
587
.reveal.center,
.reveal.center .slides,
.reveal.center .slides section {
588
	min-height: 0 !important;
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
}

/* Don't allow interaction with invisible slides */
.reveal .slides>section.future,
.reveal .slides>section>section.future,
.reveal .slides>section.past,
.reveal .slides>section>section.past {
	pointer-events: none;
}

.reveal.overview .slides>section,
.reveal.overview .slides>section>section {
	pointer-events: auto;
}

Yves Delley's avatar
Yves Delley committed
604
605
606
607
608
609
.reveal .slides>section.past,
.reveal .slides>section.future,
.reveal .slides>section>section.past,
.reveal .slides>section>section.future {
	opacity: 0;
}
610
611
612


/*********************************************
613
 * Mixins for readability of transitions
Yves Delley's avatar
Yves Delley committed
614
615
 *********************************************/

616
@mixin transition-global($style) {
617
618
	.reveal .slides section[data-transition=#{$style}],
	.reveal.#{$style} .slides section:not([data-transition]) {
619
620
		@content;
	}
Yves Delley's avatar
Yves Delley committed
621
}
622
623
624
625
626
627
@mixin transition-stack($style) {
	.reveal .slides section[data-transition=#{$style}].stack,
	.reveal.#{$style} .slides section.stack {
		@content;
	}
}
628
@mixin transition-horizontal-past($style) {
629
630
631
632
633
	.reveal .slides>section[data-transition=#{$style}].past,
	.reveal .slides>section[data-transition~=#{$style}-out].past,
	.reveal.#{$style} .slides>section:not([data-transition]).past {
		@content;
	}
Yves Delley's avatar
Yves Delley committed
634
}
635
@mixin transition-horizontal-future($style) {
636
637
638
639
640
	.reveal .slides>section[data-transition=#{$style}].future,
	.reveal .slides>section[data-transition~=#{$style}-in].future,
	.reveal.#{$style} .slides>section:not([data-transition]).future {
		@content;
	}
Yves Delley's avatar
Yves Delley committed
641
642
}

643
@mixin transition-vertical-past($style) {
644
645
646
647
648
	.reveal .slides>section>section[data-transition=#{$style}].past,
	.reveal .slides>section>section[data-transition~=#{$style}-out].past,
	.reveal.#{$style} .slides>section>section:not([data-transition]).past {
		@content;
	}
Yves Delley's avatar
Yves Delley committed
649
}
650
@mixin transition-vertical-future($style) {
651
652
653
654
655
	.reveal .slides>section>section[data-transition=#{$style}].future,
	.reveal .slides>section>section[data-transition~=#{$style}-in].future,
	.reveal.#{$style} .slides>section>section:not([data-transition]).future {
		@content;
	}
Yves Delley's avatar
Yves Delley committed
656
657
}

658
659
660
661
/*********************************************
 * SLIDE TRANSITION
 * Aliased 'linear' for backwards compatibility
 *********************************************/
Yves Delley's avatar
Yves Delley committed
662

663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
@each $stylename in slide, linear {
	.reveal.#{$stylename} section {
		backface-visibility: hidden;
	}
	@include transition-horizontal-past(#{$stylename}) {
		transform: translate(-150%, 0);
	}
	@include transition-horizontal-future(#{$stylename}) {
		transform: translate(150%, 0);
	}
	@include transition-vertical-past(#{$stylename}) {
		transform: translate(0, -150%);
	}
	@include transition-vertical-future(#{$stylename}) {
		transform: translate(0, 150%);
	}
Yves Delley's avatar
Yves Delley committed
679
680
681
682
683
}

/*********************************************
 * CONVEX TRANSITION
 * Aliased 'default' for backwards compatibility
684
685
 *********************************************/

686
@each $stylename in default, convex {
687
	@include transition-stack(#{$stylename}) {
688
689
690
		transform-style: preserve-3d;
	}

691
692
693
694
695
696
697
698
699
700
701
702
	@include transition-horizontal-past(#{$stylename}) {
		transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0);
	}
	@include transition-horizontal-future(#{$stylename}) {
		transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0);
	}
	@include transition-vertical-past(#{$stylename}) {
		transform: translate3d(0, -300px, 0) rotateX(70deg) translate3d(0, -300px, 0);
	}
	@include transition-vertical-future(#{$stylename}) {
		transform: translate3d(0, 300px, 0) rotateX(-70deg) translate3d(0, 300px, 0);
	}
703
704
705
706
707
708
}

/*********************************************
 * CONCAVE TRANSITION
 *********************************************/

709
@include transition-stack(concave) {
710
711
712
	transform-style: preserve-3d;
}

713
@include transition-horizontal-past(concave) {
714
	transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0);
715
}
716
@include transition-horizontal-future(concave) {
717
	transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0);
718
}
719
@include transition-vertical-past(concave) {
720
	transform: translate3d(0, -80%, 0) rotateX(-70deg) translate3d(0, -80%, 0);
721
}
722
@include transition-vertical-future(concave) {
723
	transform: translate3d(0, 80%, 0) rotateX(70deg) translate3d(0, 80%, 0);
724
725
726
727
728
729
730
}


/*********************************************
 * ZOOM TRANSITION
 *********************************************/

731
@include transition-global(zoom) {
732
	transition-timing-function: ease;
733
}
734
@include transition-horizontal-past(zoom) {
735
736
	visibility: hidden;
	transform: scale(16);
737
}
738
@include transition-horizontal-future(zoom) {
739
740
	visibility: hidden;
	transform: scale(0.2);
741
}
742
@include transition-vertical-past(zoom) {
743
	transform: translate(0, -150%);
744
}
745
@include transition-vertical-future(zoom) {
746
	transform: translate(0, 150%);
747
748
749
750
751
}


/*********************************************
 * CUBE TRANSITION
752
753
754
755
 *
 * WARNING:
 * this is deprecated and will be removed in a
 * future version.
756
757
758
 *********************************************/

.reveal.cube .slides {
759
	perspective: 1300px;
760
761
762
763
764
}

.reveal.cube .slides section {
	padding: 30px;
	min-height: 700px;
765
	backface-visibility: hidden;
766
	box-sizing: border-box;
767
	transform-style: preserve-3d;
768
769
}
	.reveal.center.cube .slides section {
770
		min-height: 0;
771
772
773
774
775
776
777
778
779
780
781
	}
	.reveal.cube .slides section:not(.stack):before {
		content: '';
		position: absolute;
		display: block;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		background: rgba(0,0,0,0.1);
		border-radius: 4px;
782
		transform: translateZ( -20px );
783
784
785
786
787
788
789
790
791
792
793
794
795
796
	}
	.reveal.cube .slides section:not(.stack):after {
		content: '';
		position: absolute;
		display: block;
		width: 90%;
		height: 30px;
		left: 5%;
		bottom: 0;
		background: none;
		z-index: 1;

		border-radius: 4px;
		box-shadow: 0px 95px 25px rgba(0,0,0,0.2);
797
		transform: translateZ(-90px) rotateX( 65deg );
798
799
800
801
802
803
804
805
	}

.reveal.cube .slides>section.stack {
	padding: 0;
	background: none;
}

.reveal.cube .slides>section.past {
806
807
	transform-origin: 100% 0%;
	transform: translate3d(-100%, 0, 0) rotateY(-90deg);
808
809
810
}

.reveal.cube .slides>section.future {
811
812
	transform-origin: 0% 0%;
	transform: translate3d(100%, 0, 0) rotateY(90deg);
813
814
815
}

.reveal.cube .slides>section>section.past {
816
817
	transform-origin: 0% 100%;
	transform: translate3d(0, -100%, 0) rotateX(90deg);
818
819
820
}

.reveal.cube .slides>section>section.future {
821
822
	transform-origin: 0% 0%;
	transform: translate3d(0, 100%, 0) rotateX(-90deg);
823
824
825
826
827
}


/*********************************************
 * PAGE TRANSITION
828
829
830
831
 *
 * WARNING:
 * this is deprecated and will be removed in a
 * future version.
832
833
834
 *********************************************/

.reveal.page .slides {
835
836
	perspective-origin: 0% 50%;
	perspective: 3000px;
837
838
839
840
841
}

.reveal.page .slides section {
	padding: 30px;
	min-height: 700px;
842
	box-sizing: border-box;
843
	transform-style: preserve-3d;
844
845
846
847
848
849
850
851
852
853
854
855
856
}
	.reveal.page .slides section.past {
		z-index: 12;
	}
	.reveal.page .slides section:not(.stack):before {
		content: '';
		position: absolute;
		display: block;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		background: rgba(0,0,0,0.1);
857
		transform: translateZ( -20px );
858
859
860
861
862
863
864
865
866
867
868
869
870
871
872
	}
	.reveal.page .slides section:not(.stack):after {
		content: '';
		position: absolute;
		display: block;
		width: 90%;
		height: 30px;
		left: 5%;
		bottom: 0;
		background: none;
		z-index: 1;

		border-radius: 4px;
		box-shadow: 0px 95px 25px rgba(0,0,0,0.2);

873
		-webkit-transform: translateZ(-90px) rotateX( 65deg );
874
875
876
877
878
879
880
881
	}

.reveal.page .slides>section.stack {
	padding: 0;
	background: none;
}

.reveal.page .slides>section.past {
882
883
	transform-origin: 0% 0%;
	transform: translate3d(-40%, 0, 0) rotateY(-80deg);
884
885
886
}

.reveal.page .slides>section.future {
887
888
	transform-origin: 100% 0%;
	transform: translate3d(0, 0, 0);
889
890
891
}

.reveal.page .slides>section>section.past {
892
893
	transform-origin: 0% 0%;
	transform: translate3d(0, -40%, 0) rotateX(80deg);
894
895
896
}

.reveal.page .slides>section>section.future {
897
898
	transform-origin: 0% 100%;
	transform: translate3d(0, 0, 0);
899
900
901
902
903
904
905
906
}


/*********************************************
 * FADE TRANSITION
 *********************************************/

.reveal .slides section[data-transition=fade],
Yves Delley's avatar
Yves Delley committed
907
908
.reveal.fade .slides section:not([data-transition]),
.reveal.fade .slides>section>section:not([data-transition]) {
909
	transform: none;
910
	transition: opacity 0.5s;
911
912
913
914
}


.reveal.fade.overview .slides section,
Yves Delley's avatar
Yves Delley committed
915
.reveal.fade.overview .slides>section>section {
916
	transition: none;
917
918
919
920
921
922
923
}


/*********************************************
 * NO TRANSITION
 *********************************************/

924
@include transition-global(none) {
925
926
	transform: none;
	transition: none;
927
928
929
930
931
932
933
934
935
936
937
938
939
940
941
942
943
}


/*********************************************
 * PAUSED MODE
 *********************************************/

.reveal .pause-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: black;
	visibility: hidden;
	opacity: 0;
	z-index: 100;
944
	transition: all 1s ease;
945
946
947
948
949
950
951
952
953
954
955
956
957
958
959
960
961
962
963
964
965
966
967
968
969
970
971
972
973
974
975
976
977
978
979
}
.reveal.paused .pause-overlay {
	visibility: visible;
	opacity: 1;
}


/*********************************************
 * FALLBACK
 *********************************************/

.no-transforms {
	overflow-y: auto;
}

.no-transforms .reveal .slides {
	position: relative;
	width: 80%;
	height: auto !important;
	top: 0;
	left: 50%;
	margin: 0;
	text-align: center;
}

.no-transforms .reveal .controls,
.no-transforms .reveal .progress {
	display: none !important;
}

.no-transforms .reveal .slides section {
	display: block !important;
	opacity: 1 !important;
	position: relative !important;
	height: auto;
980
	min-height: 0;
981
982
983
	top: 0;
	left: -50%;
	margin: 70px 0;
984
	transform: none;
985
986
987
988
989
990
991
992
}

.no-transforms .reveal .slides section section {
	left: 0;
}

.reveal .no-transition,
.reveal .no-transition * {
993
	transition: none !important;
994
995
996
997
998
999
1000
}


/*********************************************
 * PER-SLIDE BACKGROUNDS
 *********************************************/