| @charset "UTF-8"; |
| |
| /*! |
| * reveal.js |
| * http://lab.hakim.se/reveal-js |
| * MIT licensed |
| * |
| * Copyright (C) 2013 Hakim El Hattab, http://hakim.se |
| */ |
| |
| |
| /********************************************* |
| * 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, |
| .reveal b, .reveal u, .reveal i, .reveal center, |
| .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, |
| .reveal time, .reveal mark, .reveal audio, video { |
| 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; |
| } |
| |
| ::selection { |
| background: #FF5E99; |
| color: #fff; |
| text-shadow: none; |
| } |
| |
| |
| /********************************************* |
| * HEADERS |
| *********************************************/ |
| |
| .reveal h1, |
| .reveal h2, |
| .reveal h3, |
| .reveal h4, |
| .reveal h5, |
| .reveal h6 { |
| -webkit-hyphens: auto; |
| -moz-hyphens: auto; |
| hyphens: auto; |
| |
| word-wrap: break-word; |
| } |
| |
| .reveal h1 { font-size: 3.77em; } |
| .reveal h2 { font-size: 2.11em; } |
| .reveal h3 { font-size: 1.55em; } |
| .reveal h4 { font-size: 1em; } |
| |
| |
| /********************************************* |
| * VIEW FRAGMENTS |
| *********************************************/ |
| |
| .reveal .slides section .fragment { |
| opacity: 0; |
| |
| -webkit-transition: all .2s ease; |
| -moz-transition: all .2s ease; |
| -ms-transition: all .2s ease; |
| -o-transition: all .2s ease; |
| transition: all .2s ease; |
| } |
| .reveal .slides section .fragment.visible { |
| opacity: 1; |
| } |
| |
| .reveal .slides section .fragment.grow { |
| opacity: 1; |
| } |
| .reveal .slides section .fragment.grow.visible { |
| -webkit-transform: scale( 1.3 ); |
| -moz-transform: scale( 1.3 ); |
| -ms-transform: scale( 1.3 ); |
| -o-transform: scale( 1.3 ); |
| transform: scale( 1.3 ); |
| } |
| |
| .reveal .slides section .fragment.shrink { |
| opacity: 1; |
| } |
| .reveal .slides section .fragment.shrink.visible { |
| -webkit-transform: scale( 0.7 ); |
| -moz-transform: scale( 0.7 ); |
| -ms-transform: scale( 0.7 ); |
| -o-transform: scale( 0.7 ); |
| transform: scale( 0.7 ); |
| } |
| |
| .reveal .slides section .fragment.roll-in { |
| opacity: 0; |
| |
| -webkit-transform: rotateX( 90deg ); |
| -moz-transform: rotateX( 90deg ); |
| -ms-transform: rotateX( 90deg ); |
| -o-transform: rotateX( 90deg ); |
| transform: rotateX( 90deg ); |
| } |
| .reveal .slides section .fragment.roll-in.visible { |
| opacity: 1; |
| |
| -webkit-transform: rotateX( 0 ); |
| -moz-transform: rotateX( 0 ); |
| -ms-transform: rotateX( 0 ); |
| -o-transform: rotateX( 0 ); |
| transform: rotateX( 0 ); |
| } |
| |
| .reveal .slides section .fragment.fade-out { |
| opacity: 1; |
| } |
| .reveal .slides section .fragment.fade-out.visible { |
| opacity: 0; |
| } |
| |
| .reveal .slides section .fragment.highlight-red, |
| .reveal .slides section .fragment.highlight-green, |
| .reveal .slides section .fragment.highlight-blue { |
| opacity: 1; |
| } |
| .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; |
| } |
| |
| |
| /********************************************* |
| * DEFAULT ELEMENT STYLES |
| *********************************************/ |
| |
| /* Fixes issue in Chrome where italic fonts did not appear when printing to PDF */ |
| .reveal:after { |
| content: ''; |
| font-style: italic; |
| } |
| |
| /* Ensure certain elements are never larger than the slide itself */ |
| .reveal img, |
| .reveal video, |
| .reveal iframe { |
| max-width: 95%; |
| max-height: 95%; |
| } |
| |
| /** Prevents layering issues in certain browser/transition combinations */ |
| .reveal a { |
| position: relative; |
| } |
| |
| .reveal strong, |
| .reveal b { |
| font-weight: bold; |
| } |
| |
| .reveal em, |
| .reveal i { |
| font-style: italic; |
| } |
| |
| .reveal ol, |
| .reveal ul { |
| display: inline-block; |
| |
| text-align: left; |
| margin: 0 0 0 1em; |
| } |
| |
| .reveal ol { |
| list-style-type: decimal; |
| } |
| |
| .reveal ul { |
| list-style-type: disc; |
| } |
| |
| .reveal ul ul { |
| list-style-type: square; |
| } |
| |
| .reveal ul ul ul { |
| list-style-type: circle; |
| } |
| |
| .reveal ul ul, |
| .reveal ul ol, |
| .reveal ol ol, |
| .reveal ol ul { |
| display: block; |
| margin-left: 40px; |
| } |
| |
| .reveal p { |
| margin-bottom: 10px; |
| line-height: 1.2em; |
| } |
| |
| .reveal q, |
| .reveal blockquote { |
| quotes: none; |
| } |
| |
| .reveal blockquote { |
| display: block; |
| position: relative; |
| width: 70%; |
| margin: 5px auto; |
| padding: 5px; |
| |
| font-style: italic; |
| background: rgba(255, 255, 255, 0.05); |
| box-shadow: 0px 0px 2px rgba(0,0,0,0.2); |
| } |
| .reveal blockquote p:first-child, |
| .reveal blockquote p:last-child { |
| display: inline-block; |
| } |
| .reveal blockquote:before { |
| content: '\201C'; |
| } |
| .reveal blockquote:after { |
| content: '\201D'; |
| } |
| |
| .reveal q { |
| font-style: italic; |
| } |
| .reveal q:before { |
| content: '\201C'; |
| } |
| .reveal q:after { |
| content: '\201D'; |
| } |
| |
| .reveal pre { |
| display: block; |
| position: relative; |
| width: 90%; |
| margin: 15px auto; |
| |
| text-align: left; |
| font-size: 0.55em; |
| font-family: monospace; |
| line-height: 1.2em; |
| |
| word-wrap: break-word; |
| |
| box-shadow: 0px 0px 6px rgba(0,0,0,0.3); |
| } |
| .reveal pre code { |
| padding: 5px; |
| } |
| |
| .reveal code { |
| font-family: monospace; |
| overflow: auto; |
| max-height: 400px; |
| } |
| |
| .reveal table th, |
| .reveal table td { |
| text-align: left; |
| padding-right: .3em; |
| } |
| |
| .reveal table th { |
| text-shadow: rgb(255,255,255) 1px 1px 2px; |
| } |
| |
| .reveal sup { |
| vertical-align: super; |
| } |
| .reveal sub { |
| vertical-align: sub; |
| } |
| |
| .reveal small { |
| display: inline-block; |
| font-size: 0.6em; |
| line-height: 1.2em; |
| vertical-align: top; |
| } |
| |
| .reveal small * { |
| vertical-align: top; |
| } |
| |
| |
| /********************************************* |
| * CONTROLS |
| *********************************************/ |
| |
| .reveal .controls { |
| display: none; |
| position: fixed; |
| width: 110px; |
| height: 110px; |
| z-index: 30; |
| right: 10px; |
| bottom: 10px; |
| } |
| |
| .reveal .controls div { |
| position: absolute; |
| opacity: 0.1; |
| width: 0; |
| height: 0; |
| border: 12px solid transparent; |
| |
| -webkit-transition: opacity 0.2s ease; |
| -moz-transition: opacity 0.2s ease; |
| -ms-transition: opacity 0.2s ease; |
| -o-transition: opacity 0.2s ease; |
| transition: opacity 0.2s ease; |
| } |
| |
| .reveal .controls div.enabled { |
| opacity: 0.6; |
| cursor: pointer; |
| } |
| |
| .reveal .controls div.enabled:active { |
| margin-top: 1px; |
| } |
| |
| .reveal .controls div.navigate-left { |
| top: 42px; |
| |
| border-right-width: 22px; |
| border-right-color: #eee; |
| } |
| |
| .reveal .controls div.navigate-right { |
| left: 74px; |
| top: 42px; |
| |
| border-left-width: 22px; |
| border-left-color: #eee; |
| } |
| |
| .reveal .controls div.navigate-up { |
| left: 42px; |
| |
| border-bottom-width: 22px; |
| border-bottom-color: #eee; |
| } |
| |
| .reveal .controls div.navigate-down { |
| left: 42px; |
| top: 74px; |
| |
| border-top-width: 22px; |
| border-top-color: #eee; |
| } |
| |
| |
| /********************************************* |
| * PROGRESS BAR |
| *********************************************/ |
| |
| .reveal .progress { |
| position: fixed; |
| display: none; |
| height: 3px; |
| width: 100%; |
| bottom: 0; |
| left: 0; |
| z-index: 10; |
| } |
| .reveal .progress:after { |
| content: ''; |
| display: 'block'; |
| position: absolute; |
| height: 20px; |
| width: 100%; |
| top: -20px; |
| } |
| .reveal .progress span { |
| display: block; |
| height: 100%; |
| width: 0px; |
| |
| -webkit-transition: width 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985); |
| -moz-transition: width 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985); |
| -ms-transition: width 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985); |
| -o-transition: width 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985); |
| transition: width 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985); |
| } |
| |
| |
| /********************************************* |
| * ROLLING LINKS |
| *********************************************/ |
| |
| .reveal .roll { |
| display: inline-block; |
| line-height: 1.2; |
| overflow: hidden; |
| |
| vertical-align: top; |
| |
| -webkit-perspective: 400px; |
| -moz-perspective: 400px; |
| -ms-perspective: 400px; |
| perspective: 400px; |
| |
| -webkit-perspective-origin: 50% 50%; |
| -moz-perspective-origin: 50% 50%; |
| -ms-perspective-origin: 50% 50%; |
| perspective-origin: 50% 50%; |
| } |
| .reveal .roll:hover { |
| background: none; |
| text-shadow: none; |
| } |
| .reveal .roll span { |
| display: block; |
| position: relative; |
| padding: 0 2px; |
| |
| pointer-events: none; |
| |
| -webkit-transition: all 400ms ease; |
| -moz-transition: all 400ms ease; |
| -ms-transition: all 400ms ease; |
| transition: all 400ms ease; |
| |
| -webkit-transform-origin: 50% 0%; |
| -moz-transform-origin: 50% 0%; |
| -ms-transform-origin: 50% 0%; |
| transform-origin: 50% 0%; |
| |
| -webkit-transform-style: preserve-3d; |
| -moz-transform-style: preserve-3d; |
| -ms-transform-style: preserve-3d; |
| transform-style: preserve-3d; |
| |
| -webkit-backface-visibility: hidden; |
| -moz-backface-visibility: hidden; |
| backface-visibility: hidden; |
| } |
| .reveal .roll:hover span { |
| background: rgba(0,0,0,0.5); |
| |
| -webkit-transform: translate3d( 0px, 0px, -45px ) rotateX( 90deg ); |
| -moz-transform: translate3d( 0px, 0px, -45px ) rotateX( 90deg ); |
| -ms-transform: translate3d( 0px, 0px, -45px ) rotateX( 90deg ); |
| transform: translate3d( 0px, 0px, -45px ) rotateX( 90deg ); |
| } |
| .reveal .roll span:after { |
| content: attr(data-title); |
| |
| display: block; |
| position: absolute; |
| left: 0; |
| top: 0; |
| padding: 0 2px; |
| |
| -webkit-transform-origin: 50% 0%; |
| -moz-transform-origin: 50% 0%; |
| -ms-transform-origin: 50% 0%; |
| transform-origin: 50% 0%; |
| |
| -webkit-transform: translate3d( 0px, 110%, 0px ) rotateX( -90deg ); |
| -moz-transform: translate3d( 0px, 110%, 0px ) rotateX( -90deg ); |
| -ms-transform: translate3d( 0px, 110%, 0px ) rotateX( -90deg ); |
| transform: translate3d( 0px, 110%, 0px ) rotateX( -90deg ); |
| } |
| |
| |
| /********************************************* |
| * SLIDES |
| *********************************************/ |
| |
| .reveal { |
| position: relative; |
| width: 100%; |
| height: 100%; |
| } |
| |
| .reveal .slides { |
| position: absolute; |
| width: 100%; |
| height: 100%; |
| left: 50%; |
| top: 50%; |
| |
| overflow: visible; |
| z-index: 1; |
| text-align: center; |
| |
| -webkit-transition: -webkit-perspective .4s ease; |
| -moz-transition: -moz-perspective .4s ease; |
| -ms-transition: -ms-perspective .4s ease; |
| -o-transition: -o-perspective .4s ease; |
| transition: perspective .4s ease; |
| |
| -webkit-perspective: 600px; |
| -moz-perspective: 600px; |
| -ms-perspective: 600px; |
| perspective: 600px; |
| |
| -webkit-perspective-origin: 0px -100px; |
| -moz-perspective-origin: 0px -100px; |
| -ms-perspective-origin: 0px -100px; |
| perspective-origin: 0px -100px; |
| } |
| |
| .reveal .slides>section, |
| .reveal .slides>section>section { |
| display: none; |
| position: absolute; |
| width: 100%; |
| padding: 20px 0px; |
| |
| z-index: 10; |
| line-height: 1.2em; |
| font-weight: normal; |
| |
| -webkit-transform-style: preserve-3d; |
| -moz-transform-style: preserve-3d; |
| -ms-transform-style: preserve-3d; |
| transform-style: preserve-3d; |
| |
| -webkit-transition: -webkit-transform-origin 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985), |
| -webkit-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); |
| -moz-transition: -moz-transform-origin 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985), |
| -moz-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); |
| -ms-transition: -ms-transform-origin 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985), |
| -ms-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); |
| -o-transition: -o-transform-origin 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985), |
| -o-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); |
| transition: transform-origin 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985), |
| 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); |
| } |
| |
| .reveal .slides>section { |
| left: -50%; |
| top: -50%; |
| } |
| |
| .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; |
| } |
| |
| .reveal.center, |
| .reveal.center .slides, |
| .reveal.center .slides section { |
| min-height: auto !important; |
| } |
| |
| |
| |
| /********************************************* |
| * DEFAULT TRANSITION |
| *********************************************/ |
| |
| .reveal .slides>section.past { |
| display: block; |
| opacity: 0; |
| |
| -webkit-transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); |
| -moz-transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); |
| -ms-transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); |
| transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); |
| } |
| .reveal .slides>section.future { |
| display: block; |
| opacity: 0; |
| |
| -webkit-transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); |
| -moz-transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); |
| -ms-transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); |
| transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); |
| } |
| |
| .reveal .slides>section>section.past { |
| display: block; |
| opacity: 0; |
| |
| -webkit-transform: translate3d(0, -300px, 0) rotateX(70deg) translate3d(0, -300px, 0); |
| -moz-transform: translate3d(0, -300px, 0) rotateX(70deg) translate3d(0, -300px, 0); |
| -ms-transform: translate3d(0, -300px, 0) rotateX(70deg) translate3d(0, -300px, 0); |
| transform: translate3d(0, -300px, 0) rotateX(70deg) translate3d(0, -300px, 0); |
| } |
| .reveal .slides>section>section.future { |
| display: block; |
| opacity: 0; |
| |
| -webkit-transform: translate3d(0, 300px, 0) rotateX(-70deg) translate3d(0, 300px, 0); |
| -moz-transform: translate3d(0, 300px, 0) rotateX(-70deg) translate3d(0, 300px, 0); |
| -ms-transform: translate3d(0, 300px, 0) rotateX(-70deg) translate3d(0, 300px, 0); |
| transform: translate3d(0, 300px, 0) rotateX(-70deg) translate3d(0, 300px, 0); |
| } |
| |
| |
| /********************************************* |
| * CONCAVE TRANSITION |
| *********************************************/ |
| |
| .reveal.concave .slides>section.past { |
| -webkit-transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0); |
| -moz-transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0); |
| -ms-transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0); |
| transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0); |
| } |
| .reveal.concave .slides>section.future { |
| -webkit-transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0); |
| -moz-transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0); |
| -ms-transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0); |
| transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0); |
| } |
| |
| .reveal.concave .slides>section>section.past { |
| -webkit-transform: translate3d(0, -80%, 0) rotateX(-70deg) translate3d(0, -80%, 0); |
| -moz-transform: translate3d(0, -80%, 0) rotateX(-70deg) translate3d(0, -80%, 0); |
| -ms-transform: translate3d(0, -80%, 0) rotateX(-70deg) translate3d(0, -80%, 0); |
| transform: translate3d(0, -80%, 0) rotateX(-70deg) translate3d(0, -80%, 0); |
| } |
| .reveal.concave .slides>section>section.future { |
| -webkit-transform: translate3d(0, 80%, 0) rotateX(70deg) translate3d(0, 80%, 0); |
| -moz-transform: translate3d(0, 80%, 0) rotateX(70deg) translate3d(0, 80%, 0); |
| -ms-transform: translate3d(0, 80%, 0) rotateX(70deg) translate3d(0, 80%, 0); |
| transform: translate3d(0, 80%, 0) rotateX(70deg) translate3d(0, 80%, 0); |
| } |
| |
| |
| /********************************************* |
| * ZOOM TRANSITION |
| *********************************************/ |
| |
| .reveal.zoom .slides>section.past { |
| opacity: 0; |
| visibility: hidden; |
| |
| -webkit-transform: scale(16); |
| -moz-transform: scale(16); |
| -ms-transform: scale(16); |
| -o-transform: scale(16); |
| transform: scale(16); |
| } |
| .reveal.zoom .slides>section.future { |
| opacity: 0; |
| visibility: hidden; |
| |
| -webkit-transform: scale(0.2); |
| -moz-transform: scale(0.2); |
| -ms-transform: scale(0.2); |
| -o-transform: scale(0.2); |
| transform: scale(0.2); |
| } |
| |
| .reveal.zoom .slides>section>section.past { |
| -webkit-transform: translate(0, -150%); |
| -moz-transform: translate(0, -150%); |
| -ms-transform: translate(0, -150%); |
| -o-transform: translate(0, -150%); |
| transform: translate(0, -150%); |
| } |
| .reveal.zoom .slides>section>section.future { |
| -webkit-transform: translate(0, 150%); |
| -moz-transform: translate(0, 150%); |
| -ms-transform: translate(0, 150%); |
| -o-transform: translate(0, 150%); |
| transform: translate(0, 150%); |
| } |
| |
| |
| /********************************************* |
| * LINEAR TRANSITION |
| *********************************************/ |
| |
| .reveal.linear .slides>section.past { |
| -webkit-transform: translate(-150%, 0); |
| -moz-transform: translate(-150%, 0); |
| -ms-transform: translate(-150%, 0); |
| -o-transform: translate(-150%, 0); |
| transform: translate(-150%, 0); |
| } |
| .reveal.linear .slides>section.future { |
| -webkit-transform: translate(150%, 0); |
| -moz-transform: translate(150%, 0); |
| -ms-transform: translate(150%, 0); |
| -o-transform: translate(150%, 0); |
| transform: translate(150%, 0); |
| } |
| |
| .reveal.linear .slides>section>section.past { |
| -webkit-transform: translate(0, -150%); |
| -moz-transform: translate(0, -150%); |
| -ms-transform: translate(0, -150%); |
| -o-transform: translate(0, -150%); |
| transform: translate(0, -150%); |
| } |
| .reveal.linear .slides>section>section.future { |
| -webkit-transform: translate(0, 150%); |
| -moz-transform: translate(0, 150%); |
| -ms-transform: translate(0, 150%); |
| -o-transform: translate(0, 150%); |
| transform: translate(0, 150%); |
| } |
| |
| |
| /********************************************* |
| * CUBE TRANSITION |
| *********************************************/ |
| |
| .reveal.cube .slides { |
| -webkit-perspective: 1300px; |
| -moz-perspective: 1300px; |
| -ms-perspective: 1300px; |
| perspective: 1300px; |
| } |
| |
| .reveal.cube .slides section { |
| padding: 30px; |
| min-height: 600px; |
| |
| -webkit-backface-visibility: hidden; |
| -moz-backface-visibility: hidden; |
| -ms-backface-visibility: hidden; |
| backface-visibility: hidden; |
| |
| -webkit-box-sizing: border-box; |
| -moz-box-sizing: border-box; |
| box-sizing: border-box; |
| } |
| .reveal.center.cube .slides section { |
| min-height: auto; |
| } |
| .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; |
| |
| -webkit-transform: translateZ( -20px ); |
| -moz-transform: translateZ( -20px ); |
| -ms-transform: translateZ( -20px ); |
| -o-transform: translateZ( -20px ); |
| transform: translateZ( -20px ); |
| } |
| .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); |
| |
| -webkit-transform: translateZ(-90px) rotateX( 65deg ); |
| -moz-transform: translateZ(-90px) rotateX( 65deg ); |
| -ms-transform: translateZ(-90px) rotateX( 65deg ); |
| -o-transform: translateZ(-90px) rotateX( 65deg ); |
| transform: translateZ(-90px) rotateX( 65deg ); |
| } |
| |
| .reveal.cube .slides>section.stack { |
| padding: 0; |
| background: none; |
| } |
| |
| .reveal.cube .slides>section.past { |
| -webkit-transform-origin: 100% 0%; |
| -moz-transform-origin: 100% 0%; |
| -ms-transform-origin: 100% 0%; |
| transform-origin: 100% 0%; |
| |
| -webkit-transform: translate3d(-100%, 0, 0) rotateY(-90deg); |
| -moz-transform: translate3d(-100%, 0, 0) rotateY(-90deg); |
| -ms-transform: translate3d(-100%, 0, 0) rotateY(-90deg); |
| transform: translate3d(-100%, 0, 0) rotateY(-90deg); |
| } |
| |
| .reveal.cube .slides>section.future { |
| -webkit-transform-origin: 0% 0%; |
| -moz-transform-origin: 0% 0%; |
| -ms-transform-origin: 0% 0%; |
| transform-origin: 0% 0%; |
| |
| -webkit-transform: translate3d(100%, 0, 0) rotateY(90deg); |
| -moz-transform: translate3d(100%, 0, 0) rotateY(90deg); |
| -ms-transform: translate3d(100%, 0, 0) rotateY(90deg); |
| transform: translate3d(100%, 0, 0) rotateY(90deg); |
| } |
| |
| .reveal.cube .slides>section>section.past { |
| -webkit-transform-origin: 0% 100%; |
| -moz-transform-origin: 0% 100%; |
| -ms-transform-origin: 0% 100%; |
| transform-origin: 0% 100%; |
| |
| -webkit-transform: translate3d(0, -100%, 0) rotateX(90deg); |
| -moz-transform: translate3d(0, -100%, 0) rotateX(90deg); |
| -ms-transform: translate3d(0, -100%, 0) rotateX(90deg); |
| transform: translate3d(0, -100%, 0) rotateX(90deg); |
| } |
| |
| .reveal.cube .slides>section>section.future { |
| -webkit-transform-origin: 0% 0%; |
| -moz-transform-origin: 0% 0%; |
| -ms-transform-origin: 0% 0%; |
| transform-origin: 0% 0%; |
| |
| -webkit-transform: translate3d(0, 100%, 0) rotateX(-90deg); |
| -moz-transform: translate3d(0, 100%, 0) rotateX(-90deg); |
| -ms-transform: translate3d(0, 100%, 0) rotateX(-90deg); |
| transform: translate3d(0, 100%, 0) rotateX(-90deg); |
| } |
| |
| |
| /********************************************* |
| * PAGE TRANSITION |
| *********************************************/ |
| |
| .reveal.page .slides { |
| -webkit-perspective-origin: 0% 50%; |
| -moz-perspective-origin: 0% 50%; |
| -ms-perspective-origin: 0% 50%; |
| perspective-origin: 0% 50%; |
| |
| -webkit-perspective: 3000px; |
| -moz-perspective: 3000px; |
| -ms-perspective: 3000px; |
| perspective: 3000px; |
| } |
| |
| .reveal.page .slides section { |
| padding: 30px; |
| min-height: 600px; |
| |
| -webkit-box-sizing: border-box; |
| -moz-box-sizing: border-box; |
| box-sizing: border-box; |
| } |
| .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); |
| |
| -webkit-transform: translateZ( -20px ); |
| -moz-transform: translateZ( -20px ); |
| -ms-transform: translateZ( -20px ); |
| -o-transform: translateZ( -20px ); |
| transform: translateZ( -20px ); |
| } |
| .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); |
| |
| -webkit-transform: translateZ(-90px) rotateX( 65deg ); |
| } |
| |
| .reveal.page .slides>section.stack { |
| padding: 0; |
| background: none; |
| } |
| |
| .reveal.page .slides>section.past { |
| -webkit-transform-origin: 0% 0%; |
| -moz-transform-origin: 0% 0%; |
| -ms-transform-origin: 0% 0%; |
| transform-origin: 0% 0%; |
| |
| -webkit-transform: translate3d(-40%, 0, 0) rotateY(-80deg); |
| -moz-transform: translate3d(-40%, 0, 0) rotateY(-80deg); |
| -ms-transform: translate3d(-40%, 0, 0) rotateY(-80deg); |
| transform: translate3d(-40%, 0, 0) rotateY(-80deg); |
| } |
| |
| .reveal.page .slides>section.future { |
| -webkit-transform-origin: 100% 0%; |
| -moz-transform-origin: 100% 0%; |
| -ms-transform-origin: 100% 0%; |
| transform-origin: 100% 0%; |
| |
| -webkit-transform: translate3d(0, 0, 0); |
| -moz-transform: translate3d(0, 0, 0); |
| -ms-transform: translate3d(0, 0, 0); |
| transform: translate3d(0, 0, 0); |
| } |
| |
| .reveal.page .slides>section>section.past { |
| -webkit-transform-origin: 0% 0%; |
| -moz-transform-origin: 0% 0%; |
| -ms-transform-origin: 0% 0%; |
| transform-origin: 0% 0%; |
| |
| -webkit-transform: translate3d(0, -40%, 0) rotateX(80deg); |
| -moz-transform: translate3d(0, -40%, 0) rotateX(80deg); |
| -ms-transform: translate3d(0, -40%, 0) rotateX(80deg); |
| transform: translate3d(0, -40%, 0) rotateX(80deg); |
| } |
| |
| .reveal.page .slides>section>section.future { |
| -webkit-transform-origin: 0% 100%; |
| -moz-transform-origin: 0% 100%; |
| -ms-transform-origin: 0% 100%; |
| transform-origin: 0% 100%; |
| |
| -webkit-transform: translate3d(0, 0, 0); |
| -moz-transform: translate3d(0, 0, 0); |
| -ms-transform: translate3d(0, 0, 0); |
| transform: translate3d(0, 0, 0); |
| } |
| |
| |
| /********************************************* |
| * FADE TRANSITION |
| *********************************************/ |
| |
| .reveal.fade .slides section, |
| .reveal.fade .slides>section>section { |
| -webkit-transform: none; |
| -moz-transform: none; |
| -ms-transform: none; |
| -o-transform: none; |
| transform: none; |
| |
| -webkit-transition: opacity 0.5s; |
| -moz-transition: opacity 0.5s; |
| -ms-transition: opacity 0.5s; |
| -o-transition: opacity 0.5s; |
| transition: opacity 0.5s; |
| } |
| |
| |
| .reveal.fade.overview .slides section, |
| .reveal.fade.overview .slides>section>section, |
| .reveal.fade.exit-overview .slides section, |
| .reveal.fade.exit-overview .slides>section>section { |
| -webkit-transition: none; |
| -moz-transition: none; |
| -ms-transition: none; |
| -o-transition: none; |
| transition: none; |
| } |
| |
| |
| /********************************************* |
| * NO TRANSITION |
| *********************************************/ |
| |
| .reveal.none .slides section { |
| -webkit-transform: none; |
| -moz-transform: none; |
| -ms-transform: none; |
| -o-transform: none; |
| transform: none; |
| |
| -webkit-transition: none; |
| -moz-transition: none; |
| -ms-transition: none; |
| -o-transition: none; |
| transition: none; |
| } |
| |
| |
| /********************************************* |
| * OVERVIEW |
| *********************************************/ |
| |
| .reveal.overview .slides { |
| -webkit-perspective-origin: 0% 0%; |
| -moz-perspective-origin: 0% 0%; |
| -ms-perspective-origin: 0% 0%; |
| perspective-origin: 0% 0%; |
| |
| -webkit-perspective: 700px; |
| -moz-perspective: 700px; |
| -ms-perspective: 700px; |
| perspective: 700px; |
| } |
| |
| .reveal.overview .slides section { |
| height: 600px; |
| overflow: hidden; |
| opacity: 1!important; |
| visibility: visible!important; |
| cursor: pointer; |
| background: rgba(0,0,0,0.1); |
| } |
| .reveal.overview .slides section .fragment { |
| opacity: 1; |
| } |
| .reveal.overview .slides section:after, |
| .reveal.overview .slides section:before { |
| display: none !important; |
| } |
| .reveal.overview .slides section>section { |
| opacity: 1; |
| cursor: pointer; |
| } |
| .reveal.overview .slides section:hover { |
| background: rgba(0,0,0,0.3); |
| } |
| .reveal.overview .slides section.present { |
| background: rgba(0,0,0,0.3); |
| } |
| .reveal.overview .slides>section.stack { |
| padding: 0; |
| background: none; |
| overflow: visible; |
| } |
| |
| |
| /********************************************* |
| * PAUSED MODE |
| *********************************************/ |
| |
| .reveal .pause-overlay { |
| position: absolute; |
| top: 0; |
| left: 0; |
| width: 100%; |
| height: 100%; |
| background: black; |
| visibility: hidden; |
| opacity: 0; |
| z-index: 100; |
| |
| -webkit-transition: all 1s ease; |
| -moz-transition: all 1s ease; |
| -ms-transition: all 1s ease; |
| -o-transition: all 1s ease; |
| transition: all 1s ease; |
| } |
| .reveal.paused .pause-overlay { |
| visibility: visible; |
| opacity: 1; |
| } |
| |
| |
| /********************************************* |
| * FALLBACK |
| *********************************************/ |
| |
| .no-transforms { |
| overflow-y: auto; |
| } |
| |
| .no-transforms .slides { |
| width: 80%; |
| top: 0; |
| left: 50%; |
| margin: 0; |
| text-align: center; |
| } |
| |
| .no-transforms .slides section { |
| display: block!important; |
| opacity: 1!important; |
| position: relative!important; |
| height: auto; |
| min-height: auto; |
| top: 0; |
| left: -50%; |
| margin: 70px 0; |
| |
| -webkit-transform: none; |
| -moz-transform: none; |
| -ms-transform: none; |
| transform: none; |
| } |
| |
| .no-transforms .slides section section { |
| left: 0; |
| } |
| |
| .no-transition { |
| -webkit-transition: none; |
| -moz-transition: none; |
| -ms-transition: none; |
| -o-transition: none; |
| transition: none; |
| } |
| |
| |
| /********************************************* |
| * BACKGROUND STATES |
| *********************************************/ |
| |
| .reveal .state-background { |
| position: absolute; |
| width: 100%; |
| height: 100%; |
| background: rgba( 0, 0, 0, 0 ); |
| |
| -webkit-transition: background 800ms ease; |
| -moz-transition: background 800ms ease; |
| -ms-transition: background 800ms ease; |
| -o-transition: background 800ms ease; |
| transition: background 800ms ease; |
| } |
| .alert .reveal .state-background { |
| background: rgba( 200, 50, 30, 0.6 ); |
| } |
| .soothe .reveal .state-background { |
| background: rgba( 50, 200, 90, 0.4 ); |
| } |
| .blackout .reveal .state-background { |
| background: rgba( 0, 0, 0, 0.6 ); |
| } |
| |
| |
| /********************************************* |
| * RTL SUPPORT |
| *********************************************/ |
| |
| .reveal.rtl .slides, |
| .reveal.rtl .slides h1, |
| .reveal.rtl .slides h2, |
| .reveal.rtl .slides h3, |
| .reveal.rtl .slides h4, |
| .reveal.rtl .slides h5, |
| .reveal.rtl .slides h6 { |
| direction: rtl; |
| font-family: sans-serif; |
| } |
| |
| .reveal.rtl pre, |
| .reveal.rtl code { |
| direction: ltr; |
| } |
| |
| .reveal.rtl ol, |
| .reveal.rtl ul { |
| text-align: right; |
| } |
| |
| |
| /********************************************* |
| * SPEAKER NOTES |
| *********************************************/ |
| |
| .reveal aside.notes { |
| display: none; |
| } |
| |
| |
| /********************************************* |
| * ZOOM PLUGIN |
| *********************************************/ |
| |
| .zoomed .reveal *, |
| .zoomed .reveal *:before, |
| .zoomed .reveal *:after { |
| -webkit-transform: none !important; |
| -moz-transform: none !important; |
| -ms-transform: none !important; |
| transform: none !important; |
| |
| -webkit-backface-visibility: visible !important; |
| -moz-backface-visibility: visible !important; |
| -ms-backface-visibility: visible !important; |
| backface-visibility: visible !important; |
| } |
| |
| .zoomed .reveal .progress, |
| .zoomed .reveal .controls { |
| opacity: 0; |
| } |
| |
| .zoomed .reveal .roll span { |
| background: none; |
| } |
| |
| .zoomed .reveal .roll span:after { |
| visibility: hidden; |
| } |
| |
| |
