diff options
Diffstat (limited to 'css')
| -rw-r--r-- | css/reveal.css | 2195 | ||||
| -rw-r--r-- | css/reveal.scss (renamed from css/reveal.bare.css) | 69 | ||||
| -rw-r--r-- | css/theme/beige.css | 113 | ||||
| -rw-r--r-- | css/theme/black.css | 258 | ||||
| -rw-r--r-- | css/theme/blood.css | 147 | ||||
| -rw-r--r-- | css/theme/default.css | 119 | ||||
| -rw-r--r-- | css/theme/moon.css | 95 | ||||
| -rw-r--r-- | css/theme/night.css | 90 | ||||
| -rw-r--r-- | css/theme/serif.css | 114 | ||||
| -rw-r--r-- | css/theme/simple.css | 106 | ||||
| -rw-r--r-- | css/theme/sky.css | 96 | ||||
| -rw-r--r-- | css/theme/solarized.css | 95 | ||||
| -rw-r--r-- | css/theme/source/black.scss | 44 | ||||
| -rw-r--r-- | css/theme/source/default.scss | 1 | ||||
| -rw-r--r-- | css/theme/template/settings.scss | 11 | ||||
| -rw-r--r-- | css/theme/template/theme.scss | 13 |
16 files changed, 1662 insertions, 1904 deletions
diff --git a/css/reveal.css b/css/reveal.css index 9efa9be..beb244e 100644 --- a/css/reveal.css +++ b/css/reveal.css @@ -1,5 +1,3 @@ -@charset "UTF-8"; - /*! * reveal.js * http://lab.hakim.se/reveal-js @@ -7,1521 +5,1186 @@ * * Copyright (C) 2014 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 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; } -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 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; -} - +.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; } -html, body { - width: 100%; - height: 100%; - overflow: hidden; -} - -body { - position: relative; - line-height: 1; - - background-color: #fff; - color: #000; -} + position: relative; + line-height: 1; + background-color: #fff; + color: #000; } ::-moz-selection { - background: #FF5E99; - color: #fff; - text-shadow: none; -} + background: #FF5E99; + color: #fff; + text-shadow: none; } ::selection { - background: #FF5E99; - color: #fff; - text-shadow: none; -} - + background: #FF5E99; + color: #fff; + text-shadow: none; } /********************************************* * VIEW FRAGMENTS *********************************************/ - .reveal .slides section .fragment { - opacity: 0; - visibility: hidden; - -webkit-transition: all .2s ease; - transition: all .2s ease; -} - .reveal .slides section .fragment.visible { - opacity: 1; - visibility: visible; - } + opacity: 0; + visibility: hidden; + -webkit-transition: all 0.2s ease; + transition: all 0.2s ease; } + +.reveal .slides section .fragment.visible { + opacity: 1; + visibility: visible; } .reveal .slides section .fragment.grow { - opacity: 1; - visibility: visible; -} - .reveal .slides section .fragment.grow.visible { - -webkit-transform: scale( 1.3 ); - -ms-transform: scale( 1.3 ); - transform: scale( 1.3 ); - } + opacity: 1; + visibility: visible; } + +.reveal .slides section .fragment.grow.visible { + -webkit-transform: scale(1.3); + -ms-transform: scale(1.3); + transform: scale(1.3); } .reveal .slides section .fragment.shrink { - opacity: 1; - visibility: visible; -} - .reveal .slides section .fragment.shrink.visible { - -webkit-transform: scale( 0.7 ); - -ms-transform: scale( 0.7 ); - transform: scale( 0.7 ); - } + opacity: 1; + visibility: visible; } + +.reveal .slides section .fragment.shrink.visible { + -webkit-transform: scale(0.7); + -ms-transform: scale(0.7); + transform: scale(0.7); } .reveal .slides section .fragment.zoom-in { - -webkit-transform: scale( 0.1 ); - -ms-transform: scale( 0.1 ); - transform: scale( 0.1 ); -} + -webkit-transform: scale(0.1); + -ms-transform: scale(0.1); + transform: scale(0.1); } - .reveal .slides section .fragment.zoom-in.visible { - -webkit-transform: scale( 1 ); - -ms-transform: scale( 1 ); - transform: scale( 1 ); - } +.reveal .slides section .fragment.zoom-in.visible { + -webkit-transform: scale(1); + -ms-transform: scale(1); + transform: scale(1); } .reveal .slides section .fragment.roll-in { - -webkit-transform: rotateX( 90deg ); - transform: rotateX( 90deg ); -} - .reveal .slides section .fragment.roll-in.visible { - -webkit-transform: rotateX( 0 ); - transform: rotateX( 0 ); - } + -webkit-transform: rotateX(90deg); + transform: rotateX(90deg); } + +.reveal .slides section .fragment.roll-in.visible { + -webkit-transform: rotateX(0); + transform: rotateX(0); } .reveal .slides section .fragment.fade-out { - opacity: 1; - visibility: visible; -} - .reveal .slides section .fragment.fade-out.visible { - opacity: 0; - visibility: hidden; - } + opacity: 1; + visibility: visible; } + +.reveal .slides section .fragment.fade-out.visible { + opacity: 0; + visibility: hidden; } .reveal .slides section .fragment.semi-fade-out { - opacity: 1; - visibility: visible; -} - .reveal .slides section .fragment.semi-fade-out.visible { - opacity: 0.5; - visibility: visible; - } + opacity: 1; + visibility: visible; } + +.reveal .slides section .fragment.semi-fade-out.visible { + opacity: 0.5; + visibility: visible; } .reveal .slides section .fragment.current-visible { - opacity: 0; - visibility: hidden; -} - .reveal .slides section .fragment.current-visible.current-fragment { - opacity: 1; - visibility: visible; - } - -.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; - visibility: visible; -} - .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; - } + opacity: 0; + visibility: hidden; } + +.reveal .slides section .fragment.current-visible.current-fragment { + opacity: 1; + visibility: visible; } + +.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; + visibility: visible; } + +.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 -} + color: #ff2c2d; } + .reveal .slides section .fragment.highlight-current-green.current-fragment { - color: #17ff2e; -} + color: #17ff2e; } + .reveal .slides section .fragment.highlight-current-blue.current-fragment { - color: #1b91ff; -} + color: #1b91ff; } .reveal .slides section .fragment.strike { - opacity: 1; -} - .reveal .slides section .fragment.strike.visible { - text-decoration: line-through; - } + opacity: 1; } +.reveal .slides section .fragment.strike.visible { + text-decoration: line-through; } /********************************************* * DEFAULT ELEMENT STYLES *********************************************/ - /* Fixes issue in Chrome where italic fonts did not appear when printing to PDF */ .reveal:after { content: ''; - font-style: italic; -} + font-style: italic; } .reveal iframe { - z-index: 1; -} + z-index: 1; } /** Prevents layering issues in certain browser/transition combinations */ .reveal a { - position: relative; -} + position: relative; } .reveal .stretch { - max-width: none; - max-height: none; -} + max-width: none; + max-height: none; } .reveal pre.stretch code { - height: 100%; - max-height: 100%; - -moz-box-sizing: border-box; - box-sizing: border-box; -} - + height: 100%; + max-height: 100%; + -moz-box-sizing: border-box; + box-sizing: border-box; } /********************************************* * CONTROLS *********************************************/ - .reveal .controls { - display: none; - position: fixed; - width: 110px; - height: 110px; - z-index: 30; - right: 10px; - bottom: 10px; - - -webkit-user-select: none; -} + display: none; + position: fixed; + width: 110px; + height: 110px; + z-index: 30; + right: 10px; + bottom: 10px; + -webkit-user-select: none; } .reveal .controls div { - position: absolute; - opacity: 0.05; - width: 0; - height: 0; - border: 12px solid transparent; - - -moz-transform: scale(.9999); - -webkit-tap-highlight-color: rgba( 0, 0, 0, 0 ); - -webkit-transition: all 0.2s ease; - transition: all 0.2s ease; -} + position: absolute; + opacity: 0.05; + width: 0; + height: 0; + border: 12px solid transparent; + -webkit-transform: scale(0.9999); + -ms-transform: scale(0.9999); + transform: scale(0.9999); + -webkit-transition: all 0.2s ease; + transition: all 0.2s ease; + -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .reveal .controls div.enabled { - opacity: 0.7; - cursor: pointer; -} + opacity: 0.7; + cursor: pointer; } .reveal .controls div.enabled:active { - margin-top: 1px; -} - - .reveal .controls div.navigate-left { - top: 42px; - - border-right-width: 22px; - border-right-color: #000; - } - .reveal .controls div.navigate-left.fragmented { - opacity: 0.3; - } - - .reveal .controls div.navigate-right { - left: 74px; - top: 42px; - - border-left-width: 22px; - border-left-color: #000; - } - .reveal .controls div.navigate-right.fragmented { - opacity: 0.3; - } - - .reveal .controls div.navigate-up { - left: 42px; - - border-bottom-width: 22px; - border-bottom-color: #000; - } - .reveal .controls div.navigate-up.fragmented { - opacity: 0.3; - } - - .reveal .controls div.navigate-down { - left: 42px; - top: 74px; - - border-top-width: 22px; - border-top-color: #000; - } - .reveal .controls div.navigate-down.fragmented { - opacity: 0.3; - } + margin-top: 1px; } + +.reveal .controls div.navigate-left { + top: 42px; + border-right-width: 22px; + border-right-color: #000; } +.reveal .controls div.navigate-left.fragmented { + opacity: 0.3; } + +.reveal .controls div.navigate-right { + left: 74px; + top: 42px; + border-left-width: 22px; + border-left-color: #000; } + +.reveal .controls div.navigate-right.fragmented { + opacity: 0.3; } + +.reveal .controls div.navigate-up { + left: 42px; + border-bottom-width: 22px; + border-bottom-color: #000; } + +.reveal .controls div.navigate-up.fragmented { + opacity: 0.3; } + +.reveal .controls div.navigate-down { + left: 42px; + top: 74px; + border-top-width: 22px; + border-top-color: #000; } + +.reveal .controls div.navigate-down.fragmented { + opacity: 0.3; } /********************************************* * PROGRESS BAR *********************************************/ - .reveal .progress { - position: fixed; - display: none; - height: 3px; - width: 100%; - bottom: 0; - left: 0; - z-index: 10; - - background-color: rgba( 0, 0, 0, 0.2 ); -} - .reveal .progress:after { - content: ''; - display: block; - position: absolute; - height: 20px; - width: 100%; - top: -20px; - } - .reveal .progress span { - display: block; - height: 100%; - width: 0px; - - background-color: #000; - -webkit-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); - } + position: fixed; + display: none; + height: 3px; + width: 100%; + bottom: 0; + left: 0; + z-index: 10; + background-color: rgba(0, 0, 0, 0.2); } + +.reveal .progress:after { + content: ''; + display: block; + position: absolute; + height: 20px; + width: 100%; + top: -20px; } + +.reveal .progress span { + display: block; + height: 100%; + width: 0px; + background-color: #000; + -webkit-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); + transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); } /********************************************* * SLIDE NUMBER *********************************************/ - .reveal .slide-number { - position: fixed; - display: block; - right: 15px; - bottom: 15px; - opacity: 0.5; - z-index: 31; - font-size: 12px; -} + position: fixed; + display: block; + right: 15px; + bottom: 15px; + opacity: 0.5; + z-index: 31; + font-size: 12px; } /********************************************* * SLIDES *********************************************/ - .reveal { - position: relative; - width: 100%; - height: 100%; - -ms-touch-action: none; - touch-action: none; -} + position: relative; + width: 100%; + height: 100%; + -ms-touch-action: none; + touch-action: none; } .reveal .slides { - position: absolute; - width: 100%; - height: 100%; - top: 0; - right: 0; - bottom: 0; - left: 0; - margin: auto; - - overflow: visible; - z-index: 1; - text-align: center; - -webkit-transition: -webkit-perspective .4s ease; - transition: perspective .4s ease; - -ms-perspective: 600px; - -webkit-perspective: 600px; - perspective: 600px; - -ms-perspective-origin: 50% 40%; - -webkit-perspective-origin: 50% 40%; - perspective-origin: 50% 40%; -} - -.reveal .slides>section { - -ms-perspective: 600px; -} - -.reveal .slides>section, -.reveal .slides>section>section { - display: none; - position: absolute; - width: 100%; - padding: 20px 0px; - - z-index: 10; - -ms-transform-style: preserve-3d; - -webkit-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); - transition: -ms-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); - 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); -} + position: absolute; + width: 100%; + height: 100%; + top: 0; + right: 0; + bottom: 0; + left: 0; + margin: auto; + overflow: visible; + z-index: 1; + text-align: center; + -webkit-transition: -webkit-perspective 0.4s ease; + transition: perspective 0.4s ease; + -webkit-perspective: 600px; + perspective: 600px; + -webkit-perspective-origin: 50% 40%; + perspective-origin: 50% 40%; } + +.reveal .slides > section { + -ms-perspective: 600px; } + +.reveal .slides > section, .reveal .slides > section > section { + display: none; + position: absolute; + width: 100%; + padding: 20px 0px; + z-index: 10; + -webkit-transform-style: preserve-3d; + transform-style: preserve-3d; + -webkit-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); + transition: -ms-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); + 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); } /* Global transition speed settings */ .reveal[data-transition-speed="fast"] .slides section { - -webkit-transition-duration: 400ms; - transition-duration: 400ms; -} + -webkit-transition-duration: 400ms; + transition-duration: 400ms; } + .reveal[data-transition-speed="slow"] .slides section { - -webkit-transition-duration: 1200ms; - transition-duration: 1200ms; -} + -webkit-transition-duration: 1200ms; + transition-duration: 1200ms; } /* Slide-specific transition speed overrides */ .reveal .slides section[data-transition-speed="fast"] { - -webkit-transition-duration: 400ms; - transition-duration: 400ms; -} + -webkit-transition-duration: 400ms; + transition-duration: 400ms; } + .reveal .slides section[data-transition-speed="slow"] { - -webkit-transition-duration: 1200ms; - transition-duration: 1200ms; -} - -.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; -} + -webkit-transition-duration: 1200ms; + transition-duration: 1200ms; } + +.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; } /* 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; -} - -.reveal .slides>section.past, -.reveal .slides>section.future, -.reveal .slides>section>section.past, -.reveal .slides>section>section.future { - opacity: 0; -} +.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; } +.reveal .slides > section.past, .reveal .slides > section.future, .reveal .slides > section > section.past, .reveal .slides > section > section.future { + opacity: 0; } /********************************************* * SLIDE TRANSITION * Aliased 'linear' for backwards compatibility *********************************************/ - -.reveal.slide section, -.reveal.linear section { - -ms-backface-visibility: hidden; - -webkit-backface-visibility: hidden; - backface-visibility: hidden; -} - -.reveal .slides>section[data-transition=slide].past, -.reveal.slide .slides>section:not([data-transition]).past, -.reveal .slides>section[data-transition=linear].past, -.reveal.linear .slides>section:not([data-transition]).past { - -webkit-transform: translate(-150%, 0); - -ms-transform: translate(-150%, 0); - transform: translate(-150%, 0); -} -.reveal .slides>section[data-transition=slide].future, -.reveal.slide .slides>section:not([data-transition]).future, -.reveal .slides>section[data-transition=linear].future, -.reveal.linear .slides>section:not([data-transition]).future { - -webkit-transform: translate(150%, 0); - -ms-transform: translate(150%, 0); - transform: translate(150%, 0); -} - -.reveal .slides>section>section[data-transition=slide].past, -.reveal.slide .slides>section>section:not([data-transition]).past, -.reveal .slides>section>section[data-transition=linear].past, -.reveal.linear .slides>section>section:not([data-transition]).past { - -webkit-transform: translate(0, -150%); - -ms-transform: translate(0, -150%); - transform: translate(0, -150%); -} -.reveal .slides>section>section[data-transition=slide].future, -.reveal.slide .slides>section>section:not([data-transition]).future, -.reveal .slides>section>section[data-transition=linear].future, -.reveal.linear .slides>section>section:not([data-transition]).future { - -webkit-transform: translate(0, 150%); - -ms-transform: translate(0, 150%); - transform: translate(0, 150%); -} - +.reveal.slide section, .reveal.linear section { + -webkit-backface-visibility: hidden; + backface-visibility: hidden; } + +.reveal .slides > section[data-transition=slide].past, .reveal.slide .slides > section:not([data-transition]).past, .reveal .slides > section[data-transition=linear].past, .reveal.linear .slides > section:not([data-transition]).past { + -webkit-transform: translate(-150%, 0); + -ms-transform: translate(-150%, 0); + transform: translate(-150%, 0); } + +.reveal .slides > section[data-transition=slide].future, .reveal.slide .slides > section:not([data-transition]).future, .reveal .slides > section[data-transition=linear].future, .reveal.linear .slides > section:not([data-transition]).future { + -webkit-transform: translate(150%, 0); + -ms-transform: translate(150%, 0); + transform: translate(150%, 0); } + +.reveal .slides > section > section[data-transition=slide].past, .reveal.slide .slides > section > section:not([data-transition]).past, .reveal .slides > section > section[data-transition=linear].past, .reveal.linear .slides > section > section:not([data-transition]).past { + -webkit-transform: translate(0, -150%); + -ms-transform: translate(0, -150%); + transform: translate(0, -150%); } + +.reveal .slides > section > section[data-transition=slide].future, .reveal.slide .slides > section > section:not([data-transition]).future, .reveal .slides > section > section[data-transition=linear].future, .reveal.linear .slides > section > section:not([data-transition]).future { + -webkit-transform: translate(0, 150%); + -ms-transform: translate(0, 150%); + transform: translate(0, 150%); } /********************************************* * CONVEX TRANSITION * Aliased 'default' for backwards compatibility *********************************************/ +.reveal .slides > section[data-transition=default].past, .reveal.default .slides > section:not([data-transition]).past, .reveal .slides > section[data-transition=convex].past, .reveal.convex .slides > section:not([data-transition]).past { + -webkit-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[data-transition=default].past, -.reveal.default .slides>section:not([data-transition]).past, -.reveal .slides>section[data-transition=convex].past, -.reveal.convex .slides>section:not([data-transition]).past { - -webkit-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[data-transition=default].future, -.reveal.default .slides>section:not([data-transition]).future, -.reveal .slides>section[data-transition=convex].future, -.reveal.convex .slides>section:not([data-transition]).future { - -webkit-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[data-transition=default].past, -.reveal.default .slides>section>section:not([data-transition]).past, -.reveal .slides>section>section[data-transition=convex].past, -.reveal.convex .slides>section>section:not([data-transition]).past { - -webkit-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[data-transition=default].future, -.reveal.default .slides>section>section:not([data-transition]).future, -.reveal .slides>section>section[data-transition=convex].future, -.reveal.convex .slides>section>section:not([data-transition]).future { - -webkit-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[data-transition=default].future, .reveal.default .slides > section:not([data-transition]).future, .reveal .slides > section[data-transition=convex].future, .reveal.convex .slides > section:not([data-transition]).future { + -webkit-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[data-transition=default].past, .reveal.default .slides > section > section:not([data-transition]).past, .reveal .slides > section > section[data-transition=convex].past, .reveal.convex .slides > section > section:not([data-transition]).past { + -webkit-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[data-transition=default].future, .reveal.default .slides > section > section:not([data-transition]).future, .reveal .slides > section > section[data-transition=convex].future, .reveal.convex .slides > section > section:not([data-transition]).future { + -webkit-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 .slides > section[data-transition=concave].past, .reveal.concave .slides > section:not([data-transition]).past { + -webkit-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[data-transition=concave].future, .reveal.concave .slides > section:not([data-transition]).future { + -webkit-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[data-transition=concave].past, -.reveal.concave .slides>section:not([data-transition]).past { - -webkit-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[data-transition=concave].future, -.reveal.concave .slides>section:not([data-transition]).future { - -webkit-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[data-transition=concave].past, -.reveal.concave .slides>section>section:not([data-transition]).past { - -webkit-transform: translate3d(0, -80%, 0) rotateX(-70deg) translate3d(0, -80%, 0); - transform: translate3d(0, -80%, 0) rotateX(-70deg) translate3d(0, -80%, 0); -} -.reveal .slides>section>section[data-transition=concave].future, -.reveal.concave .slides>section>section:not([data-transition]).future { - -webkit-transform: translate3d(0, 80%, 0) rotateX(70deg) translate3d(0, 80%, 0); - transform: translate3d(0, 80%, 0) rotateX(70deg) translate3d(0, 80%, 0); -} +.reveal .slides > section > section[data-transition=concave].past, .reveal.concave .slides > section > section:not([data-transition]).past { + -webkit-transform: translate3d(0, -80%, 0) rotateX(-70deg) translate3d(0, -80%, 0); + transform: translate3d(0, -80%, 0) rotateX(-70deg) translate3d(0, -80%, 0); } +.reveal .slides > section > section[data-transition=concave].future, .reveal.concave .slides > section > section:not([data-transition]).future { + -webkit-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 .slides>section[data-transition=zoom], -.reveal.zoom .slides>section:not([data-transition]) { - -webkit-transition-timing-function: ease; - transition-timing-function: ease; -} - -.reveal .slides>section[data-transition=zoom].past, -.reveal.zoom .slides>section:not([data-transition]).past { - visibility: hidden; - -webkit-transform: scale(16); - -ms-transform: scale(16); - transform: scale(16); -} -.reveal .slides>section[data-transition=zoom].future, -.reveal.zoom .slides>section:not([data-transition]).future { - visibility: hidden; - -webkit-transform: scale(0.2); - -ms-transform: scale(0.2); - transform: scale(0.2); -} - -.reveal .slides>section>section[data-transition=zoom].past, -.reveal.zoom .slides>section>section:not([data-transition]).past { - -webkit-transform: translate(0, -150%); - -ms-transform: translate(0, -150%); - transform: translate(0, -150%); -} -.reveal .slides>section>section[data-transition=zoom].future, -.reveal.zoom .slides>section>section:not([data-transition]).future { - -webkit-transform: translate(0, 150%); - -ms-transform: translate(0, 150%); - transform: translate(0, 150%); -} - +.reveal .slides > section[data-transition=zoom], .reveal.zoom .slides > section:not([data-transition]) { + -webkit-transition-timing-function: ease; + transition-timing-function: ease; } + +.reveal .slides > section[data-transition=zoom].past, .reveal.zoom .slides > section:not([data-transition]).past { + visibility: hidden; + -webkit-transform: scale(16); + -ms-transform: scale(16); + transform: scale(16); } + +.reveal .slides > section[data-transition=zoom].future, .reveal.zoom .slides > section:not([data-transition]).future { + visibility: hidden; + -webkit-transform: scale(0.2); + -ms-transform: scale(0.2); + transform: scale(0.2); } + +.reveal .slides > section > section[data-transition=zoom].past, .reveal.zoom .slides > section > section:not([data-transition]).past { + -webkit-transform: translate(0, -150%); + -ms-transform: translate(0, -150%); + transform: translate(0, -150%); } + +.reveal .slides > section > section[data-transition=zoom].future, .reveal.zoom .slides > section > section:not([data-transition]).future { + -webkit-transform: translate(0, 150%); + -ms-transform: translate(0, 150%); + transform: translate(0, 150%); } /********************************************* * CUBE TRANSITION *********************************************/ - .reveal.cube .slides { - -ms-perspective: 1300px; - -webkit-perspective: 1300px; - perspective: 1300px; -} + -webkit-perspective: 1300px; + perspective: 1300px; } .reveal.cube .slides section { - padding: 30px; - min-height: 700px; - -ms-backface-visibility: hidden; - -webkit-backface-visibility: hidden; - backface-visibility: hidden; - -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 ); - 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 ); - transform: translateZ(-90px) rotateX( 65deg ); - } - -.reveal.cube .slides>section.stack { - padding: 0; - background: none; -} - -.reveal.cube .slides>section.past { - -webkit-transform-origin: 100% 0%; - -ms-transform-origin: 100% 0%; - transform-origin: 100% 0%; - -webkit-transform: translate3d(-100%, 0, 0) rotateY(-90deg); - transform: translate3d(-100%, 0, 0) rotateY(-90deg); -} - -.reveal.cube .slides>section.future { - -webkit-transform-origin: 0% 0%; - -ms-transform-origin: 0% 0%; - transform-origin: 0% 0%; - -webkit-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%; - -ms-transform-origin: 0% 100%; - transform-origin: 0% 100%; - -webkit-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%; - -ms-transform-origin: 0% 0%; - transform-origin: 0% 0%; - -webkit-transform: translate3d(0, 100%, 0) rotateX(-90deg); - transform: translate3d(0, 100%, 0) rotateX(-90deg); -} + padding: 30px; + min-height: 700px; + -webkit-backface-visibility: hidden; + backface-visibility: hidden; + -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); + 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); + transform: translateZ(-90px) rotateX(65deg); } + +.reveal.cube .slides > section.stack { + padding: 0; + background: none; } + +.reveal.cube .slides > section.past { + -webkit-transform-origin: 100% 0%; + -ms-transform-origin: 100% 0%; + transform-origin: 100% 0%; + -webkit-transform: translate3d(-100%, 0, 0) rotateY(-90deg); + transform: translate3d(-100%, 0, 0) rotateY(-90deg); } + +.reveal.cube .slides > section.future { + -webkit-transform-origin: 0% 0%; + -ms-transform-origin: 0% 0%; + transform-origin: 0% 0%; + -webkit-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%; + -ms-transform-origin: 0% 100%; + transform-origin: 0% 100%; + -webkit-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%; + -ms-transform-origin: 0% 0%; + transform-origin: 0% 0%; + -webkit-transform: translate3d(0, 100%, 0) rotateX(-90deg); + transform: translate3d(0, 100%, 0) rotateX(-90deg); } /********************************************* * PAGE TRANSITION *********************************************/ - .reveal.page .slides { - -ms-perspective-origin: 0% 50%; - -webkit-perspective-origin: 0% 50%; - perspective-origin: 0% 50%; - -ms-perspective: 3000px; - -webkit-perspective: 3000px; - perspective: 3000px; -} + -webkit-perspective-origin: 0% 50%; + perspective-origin: 0% 50%; + -webkit-perspective: 3000px; + perspective: 3000px; } .reveal.page .slides section { - padding: 30px; - min-height: 700px; - -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 ); - 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%; - -ms-transform-origin: 0% 0%; - transform-origin: 0% 0%; - -webkit-transform: translate3d(-40%, 0, 0) rotateY(-80deg); - transform: translate3d(-40%, 0, 0) rotateY(-80deg); -} - -.reveal.page .slides>section.future { - -webkit-transform-origin: 100% 0%; - -ms-transform-origin: 100% 0%; - transform-origin: 100% 0%; - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); -} - -.reveal.page .slides>section>section.past { - -webkit-transform-origin: 0% 0%; - -ms-transform-origin: 0% 0%; - transform-origin: 0% 0%; - -webkit-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%; - -ms-transform-origin: 0% 100%; - transform-origin: 0% 100%; - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); -} + padding: 30px; + min-height: 700px; + -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); + 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%; + -ms-transform-origin: 0% 0%; + transform-origin: 0% 0%; + -webkit-transform: translate3d(-40%, 0, 0) rotateY(-80deg); + transform: translate3d(-40%, 0, 0) rotateY(-80deg); } + +.reveal.page .slides > section.future { + -webkit-transform-origin: 100% 0%; + -ms-transform-origin: 100% 0%; + transform-origin: 100% 0%; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); } + +.reveal.page .slides > section > section.past { + -webkit-transform-origin: 0% 0%; + -ms-transform-origin: 0% 0%; + transform-origin: 0% 0%; + -webkit-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%; + -ms-transform-origin: 0% 100%; + transform-origin: 0% 100%; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); } /********************************************* * FADE TRANSITION *********************************************/ +.reveal .slides section[data-transition=fade], .reveal.fade .slides section:not([data-transition]), .reveal.fade .slides > section > section:not([data-transition]) { + -webkit-transform: none; + -ms-transform: none; + transform: none; + -webkit-transition: opacity 0.5s; + transition: opacity 0.5s; } -.reveal .slides section[data-transition=fade], -.reveal.fade .slides section:not([data-transition]), -.reveal.fade .slides>section>section:not([data-transition]) { - -webkit-transform: none; - -ms-transform: none; - transform: none; - -webkit-transition: opacity 0.5s; - transition: opacity 0.5s; -} - - -.reveal.fade.overview .slides section, -.reveal.fade.overview .slides>section>section { - -webkit-transition: none; - transition: none; -} - +.reveal.fade.overview .slides section, .reveal.fade.overview .slides > section > section { + -webkit-transition: none; + transition: none; } /********************************************* * NO TRANSITION *********************************************/ - -.reveal .slides section[data-transition=none], -.reveal.none .slides section:not([data-transition]) { - -webkit-transform: none; - -ms-transform: none; - transform: none; - -webkit-transition: none; - transition: none; -} - +.reveal .slides section[data-transition=none], .reveal.none .slides section:not([data-transition]) { + -webkit-transform: none; + -ms-transform: none; + transform: none; + -webkit-transition: none; + transition: none; } /********************************************* * OVERVIEW *********************************************/ - .reveal.overview .slides { - -ms-perspective-origin: 50% 50%; - -webkit-perspective-origin: 50% 50%; - perspective-origin: 50% 50%; - -ms-perspective: 700px; - -webkit-perspective: 700px; - perspective: 700px; -} + -webkit-perspective-origin: 50% 50%; + perspective-origin: 50% 50%; + -webkit-perspective: 700px; + perspective: 700px; } .reveal.overview .slides section { - height: 700px; - overflow: hidden; - opacity: 1 !important; - visibility: visible !important; - cursor: pointer; - background: rgba(0,0,0,0.1); - -moz-box-sizing: border-box; - box-sizing: border-box; -} -.reveal.overview .slides section, -.reveal.overview-deactivating .slides section { - -webkit-transition: none !important; - transition: none !important; -} + height: 700px; + overflow: hidden; + opacity: 1 !important; + visibility: visible !important; + cursor: pointer; + background: rgba(0, 0, 0, 0.1); + -moz-box-sizing: border-box; + box-sizing: border-box; } + +.reveal.overview .slides section, .reveal.overview-deactivating .slides section { + -webkit-transition: none !important; + transition: none !important; } + .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; - top: 0 !important; - background: none; - overflow: visible; -} + 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; + top: 0 !important; + 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; - transition: all 1s ease; -} -.reveal.paused .pause-overlay { - visibility: visible; - opacity: 1; -} + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background: black; + visibility: hidden; + opacity: 0; + z-index: 100; + -webkit-transition: all 1s ease; + transition: all 1s ease; } +.reveal.paused .pause-overlay { + visibility: visible; + opacity: 1; } /********************************************* * FALLBACK *********************************************/ - .no-transforms { - overflow-y: auto; -} + 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; -} + 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; - min-height: auto; - top: 0; - left: -50%; - margin: 70px 0; - -webkit-transform: none; - -ms-transform: none; - transform: none; -} + display: block !important; + opacity: 1 !important; + position: relative !important; + height: auto; + min-height: auto; + top: 0; + left: -50%; + margin: 70px 0; + -webkit-transform: none; + -ms-transform: none; + transform: none; } .no-transforms .reveal .slides section section { - left: 0; -} - -.reveal .no-transition, -.reveal .no-transition * { - -webkit-transition: none !important; - transition: none !important; -} + left: 0; } +.reveal .no-transition, .reveal .no-transition * { + -webkit-transition: none !important; + transition: none !important; } /********************************************* * BACKGROUND STATES [DEPRECATED] *********************************************/ - .reveal .state-background { - position: absolute; - width: 100%; - height: 100%; - background: rgba( 0, 0, 0, 0 ); - -webkit-transition: background 800ms ease; - transition: background 800ms ease; -} + position: absolute; + width: 100%; + height: 100%; + background: rgba(0, 0, 0, 0); + -webkit-transition: background 800ms ease; + transition: background 800ms ease; } + .alert .reveal .state-background { - background: rgba( 200, 50, 30, 0.6 ); -} + background: rgba(200, 50, 30, 0.6); } + .soothe .reveal .state-background { - background: rgba( 50, 200, 90, 0.4 ); -} + background: rgba(50, 200, 90, 0.4); } + .blackout .reveal .state-background { - background: rgba( 0, 0, 0, 0.6 ); -} + background: rgba(0, 0, 0, 0.6); } + .whiteout .reveal .state-background { - background: rgba( 255, 255, 255, 0.6 ); -} + background: rgba(255, 255, 255, 0.6); } + .cobalt .reveal .state-background { - background: rgba( 22, 152, 213, 0.6 ); -} + background: rgba(22, 152, 213, 0.6); } + .mint .reveal .state-background { - background: rgba( 22, 213, 75, 0.6 ); -} + background: rgba(22, 213, 75, 0.6); } + .submerge .reveal .state-background { - background: rgba( 12, 25, 77, 0.6); -} + background: rgba(12, 25, 77, 0.6); } + .lila .reveal .state-background { - background: rgba( 180, 50, 140, 0.6 ); -} -.sunset .reveal .state-background { - background: rgba( 255, 122, 0, 0.6 ); -} + background: rgba(180, 50, 140, 0.6); } +.sunset .reveal .state-background { + background: rgba(255, 122, 0, 0.6); } /********************************************* * PER-SLIDE BACKGROUNDS *********************************************/ - -.reveal>.backgrounds { - position: absolute; - width: 100%; - height: 100%; - top: 0; - left: 0; - -ms-perspective: 600px; - -webkit-perspective: 600px; - perspective: 600px; -} - .reveal .slide-background { - display: none; - position: absolute; - width: 100%; - height: 100%; - opacity: 0; - visibility: hidden; - - background-color: rgba( 0, 0, 0, 0 ); - background-position: 50% 50%; - background-repeat: no-repeat; - background-size: cover; - -webkit-transition: all 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985); - transition: all 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985); - } - - .reveal .slide-background.stack { - display: block; - } - - .reveal .slide-background.present { - opacity: 1; - visibility: visible; - } - - .print-pdf .reveal .slide-background { - opacity: 1 !important; - visibility: visible !important; - } +.reveal > .backgrounds { + position: absolute; + width: 100%; + height: 100%; + top: 0; + left: 0; + -webkit-perspective: 600px; + perspective: 600px; } + +.reveal .slide-background { + display: none; + position: absolute; + width: 100%; + height: 100%; + opacity: 0; + visibility: hidden; + background-color: rgba(0, 0, 0, 0); + background-position: 50% 50%; + background-repeat: no-repeat; + background-size: cover; + -webkit-transition: all 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); + transition: all 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); } + +.reveal .slide-background.stack { + display: block; } + +.reveal .slide-background.present { + opacity: 1; + visibility: visible; } + +.print-pdf .reveal .slide-background { + opacity: 1 !important; + visibility: visible !important; } /* Video backgrounds */ .reveal .slide-background video { - position: absolute; - width: 100%; - height: 100%; - max-width: none; - max-height: none; - top: 0; - left: 0; -} + position: absolute; + width: 100%; + height: 100%; + max-width: none; + max-height: none; + top: 0; + left: 0; } /* Immediate transition style */ -.reveal[data-background-transition=none]>.backgrounds .slide-background, -.reveal>.backgrounds .slide-background[data-background-transition=none] { - -webkit-transition: none; - transition: none; -} +.reveal[data-background-transition=none] > .backgrounds .slide-background, .reveal > .backgrounds .slide-background[data-background-transition=none] { + -webkit-transition: none; + transition: none; } /* Slide */ -.reveal[data-background-transition=slide]>.backgrounds .slide-background, -.reveal>.backgrounds .slide-background[data-background-transition=slide] { - opacity: 1; - -ms-backface-visibility: hidden; - -webkit-backface-visibility: hidden; - backface-visibility: hidden; -} - .reveal[data-background-transition=slide]>.backgrounds .slide-background.past, - .reveal>.backgrounds .slide-background.past[data-background-transition=slide] { - -webkit-transform: translate(-100%, 0); - -ms-transform: translate(-100%, 0); - transform: translate(-100%, 0); - } - .reveal[data-background-transition=slide]>.backgrounds .slide-background.future, - .reveal>.backgrounds .slide-background.future[data-background-transition=slide] { - -webkit-transform: translate(100%, 0); - -ms-transform: translate(100%, 0); - transform: translate(100%, 0); - } - - .reveal[data-background-transition=slide]>.backgrounds .slide-background>.slide-background.past, - .reveal>.backgrounds .slide-background>.slide-background.past[data-background-transition=slide] { - -webkit-transform: translate(0, -100%); - -ms-transform: translate(0, -100%); - transform: translate(0, -100%); - } - .reveal[data-background-transition=slide]>.backgrounds .slide-background>.slide-background.future, - .reveal>.backgrounds .slide-background>.slide-background.future[data-background-transition=slide] { - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - transform: translate(0, 100%); - } - +.reveal[data-background-transition=slide] > .backgrounds .slide-background, .reveal > .backgrounds .slide-background[data-background-transition=slide] { + opacity: 1; + -webkit-backface-visibility: hidden; + backface-visibility: hidden; } + +.reveal[data-background-transition=slide] > .backgrounds .slide-background.past, .reveal > .backgrounds .slide-background.past[data-background-transition=slide] { + -webkit-transform: translate(-100%, 0); + -ms-transform: translate(-100%, 0); + transform: translate(-100%, 0); } + +.reveal[data-background-transition=slide] > .backgrounds .slide-background.future, .reveal > .backgrounds .slide-background.future[data-background-transition=slide] { + -webkit-transform: translate(100%, 0); + -ms-transform: translate(100%, 0); + transform: translate(100%, 0); } + +.reveal[data-background-transition=slide] > .backgrounds .slide-background > .slide-background.past, .reveal > .backgrounds .slide-background > .slide-background.past[data-background-transition=slide] { + -webkit-transform: translate(0, -100%); + -ms-transform: translate(0, -100%); + transform: translate(0, -100%); } + +.reveal[data-background-transition=slide] > .backgrounds .slide-background > .slide-background.future, .reveal > .backgrounds .slide-background > .slide-background.future[data-background-transition=slide] { + -webkit-transform: translate(0, 100%); + -ms-transform: translate(0, 100%); + transform: translate(0, 100%); } /* Convex */ -.reveal[data-background-transition=convex]>.backgrounds .slide-background.past, -.reveal>.backgrounds .slide-background.past[data-background-transition=convex] { - opacity: 0; - -webkit-transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); - transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); -} -.reveal[data-background-transition=convex]>.backgrounds .slide-background.future, -.reveal>.backgrounds .slide-background.future[data-background-transition=convex] { - opacity: 0; - -webkit-transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); - transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); -} - -.reveal[data-background-transition=convex]>.backgrounds .slide-background>.slide-background.past, -.reveal>.backgrounds .slide-background>.slide-background.past[data-background-transition=convex] { - opacity: 0; - -webkit-transform: translate3d(0, -100%, 0) rotateX(90deg) translate3d(0, -100%, 0); - transform: translate3d(0, -100%, 0) rotateX(90deg) translate3d(0, -100%, 0); -} -.reveal[data-background-transition=convex]>.backgrounds .slide-background>.slide-background.future, -.reveal>.backgrounds .slide-background>.slide-background.future[data-background-transition=convex] { - opacity: 0; - -webkit-transform: translate3d(0, 100%, 0) rotateX(-90deg) translate3d(0, 100%, 0); - transform: translate3d(0, 100%, 0) rotateX(-90deg) translate3d(0, 100%, 0); -} - +.reveal[data-background-transition=convex] > .backgrounds .slide-background.past, .reveal > .backgrounds .slide-background.past[data-background-transition=convex] { + opacity: 0; + -webkit-transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); + transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); } + +.reveal[data-background-transition=convex] > .backgrounds .slide-background.future, .reveal > .backgrounds .slide-background.future[data-background-transition=convex] { + opacity: 0; + -webkit-transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); + transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); } + +.reveal[data-background-transition=convex] > .backgrounds .slide-background > .slide-background.past, .reveal > .backgrounds .slide-background > .slide-background.past[data-background-transition=convex] { + opacity: 0; + -webkit-transform: translate3d(0, -100%, 0) rotateX(90deg) translate3d(0, -100%, 0); + transform: translate3d(0, -100%, 0) rotateX(90deg) translate3d(0, -100%, 0); } + +.reveal[data-background-transition=convex] > .backgrounds .slide-background > .slide-background.future, .reveal > .backgrounds .slide-background > .slide-background.future[data-background-transition=convex] { + opacity: 0; + -webkit-transform: translate3d(0, 100%, 0) rotateX(-90deg) translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0) rotateX(-90deg) translate3d(0, 100%, 0); } /* Concave */ -.reveal[data-background-transition=concave]>.backgrounds .slide-background.past, -.reveal>.backgrounds .slide-background.past[data-background-transition=concave] { - opacity: 0; - -webkit-transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0); - transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0); -} -.reveal[data-background-transition=concave]>.backgrounds .slide-background.future, -.reveal>.backgrounds .slide-background.future[data-background-transition=concave] { - opacity: 0; - -webkit-transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0); - transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0); -} - -.reveal[data-background-transition=concave]>.backgrounds .slide-background>.slide-background.past, -.reveal>.backgrounds .slide-background>.slide-background.past[data-background-transition=concave] { - opacity: 0; - -webkit-transform: translate3d(0, -100%, 0) rotateX(-90deg) translate3d(0, -100%, 0); - transform: translate3d(0, -100%, 0) rotateX(-90deg) translate3d(0, -100%, 0); -} -.reveal[data-background-transition=concave]>.backgrounds .slide-background>.slide-background.future, -.reveal>.backgrounds .slide-background>.slide-background.future[data-background-transition=concave] { - opacity: 0; - -webkit-transform: translate3d(0, 100%, 0) rotateX(90deg) translate3d(0, 100%, 0); - transform: translate3d(0, 100%, 0) rotateX(90deg) translate3d(0, 100%, 0); -} +.reveal[data-background-transition=concave] > .backgrounds .slide-background.past, .reveal > .backgrounds .slide-background.past[data-background-transition=concave] { + opacity: 0; + -webkit-transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0); + transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0); } + +.reveal[data-background-transition=concave] > .backgrounds .slide-background.future, .reveal > .backgrounds .slide-background.future[data-background-transition=concave] { + opacity: 0; + -webkit-transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0); + transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0); } + +.reveal[data-background-transition=concave] > .backgrounds .slide-background > .slide-background.past, .reveal > .backgrounds .slide-background > .slide-background.past[data-background-transition=concave] { + opacity: 0; + -webkit-transform: translate3d(0, -100%, 0) rotateX(-90deg) translate3d(0, -100%, 0); + transform: translate3d(0, -100%, 0) rotateX(-90deg) translate3d(0, -100%, 0); } + +.reveal[data-background-transition=concave] > .backgrounds .slide-background > .slide-background.future, .reveal > .backgrounds .slide-background > .slide-background.future[data-background-transition=concave] { + opacity: 0; + -webkit-transform: translate3d(0, 100%, 0) rotateX(90deg) translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0) rotateX(90deg) translate3d(0, 100%, 0); } /* Zoom */ -.reveal[data-background-transition=zoom]>.backgrounds .slide-background, -.reveal>.backgrounds .slide-background[data-background-transition=zoom] { - -webkit-transition-timing-function: ease; - transition-timing-function: ease; -} - -.reveal[data-background-transition=zoom]>.backgrounds .slide-background.past, -.reveal>.backgrounds .slide-background.past[data-background-transition=zoom] { - opacity: 0; - visibility: hidden; - -webkit-transform: scale(16); - -ms-transform: scale(16); - transform: scale(16); -} -.reveal[data-background-transition=zoom]>.backgrounds .slide-background.future, -.reveal>.backgrounds .slide-background.future[data-background-transition=zoom] { - opacity: 0; - visibility: hidden; - -webkit-transform: scale(0.2); - -ms-transform: scale(0.2); - transform: scale(0.2); -} - -.reveal[data-background-transition=zoom]>.backgrounds .slide-background>.slide-background.past, -.reveal>.backgrounds .slide-background>.slide-background.past[data-background-transition=zoom] { - opacity: 0; - visibility: hidden; - -webkit-transform: scale(16); - -ms-transform: scale(16); - transform: scale(16); -} -.reveal[data-background-transition=zoom]>.backgrounds .slide-background>.slide-background.future, -.reveal>.backgrounds .slide-background>.slide-background.future[data-background-transition=zoom] { - opacity: 0; - visibility: hidden; - -webkit-transform: scale(0.2); - -ms-transform: scale(0.2); - transform: scale(0.2); -} - +.reveal[data-background-transition=zoom] > .backgrounds .slide-background, .reveal > .backgrounds .slide-background[data-background-transition=zoom] { + -webkit-transition-timing-function: ease; + transition-timing-function: ease; } + +.reveal[data-background-transition=zoom] > .backgrounds .slide-background.past, .reveal > .backgrounds .slide-background.past[data-background-transition=zoom] { + opacity: 0; + visibility: hidden; + -webkit-transform: scale(16); + -ms-transform: scale(16); + transform: scale(16); } + +.reveal[data-background-transition=zoom] > .backgrounds .slide-background.future, .reveal > .backgrounds .slide-background.future[data-background-transition=zoom] { + opacity: 0; + visibility: hidden; + -webkit-transform: scale(0.2); + -ms-transform: scale(0.2); + transform: scale(0.2); } + +.reveal[data-background-transition=zoom] > .backgrounds .slide-background > .slide-background.past, .reveal > .backgrounds .slide-background > .slide-background.past[data-background-transition=zoom] { + opacity: 0; + visibility: hidden; + -webkit-transform: scale(16); + -ms-transform: scale(16); + transform: scale(16); } + +.reveal[data-background-transition=zoom] > .backgrounds .slide-background > .slide-background.future, .reveal > .backgrounds .slide-background > .slide-background.future[data-background-transition=zoom] { + opacity: 0; + visibility: hidden; + -webkit-transform: scale(0.2); + -ms-transform: scale(0.2); + transform: scale(0.2); } /* Global transition speed settings */ -.reveal[data-transition-speed="fast"]>.backgrounds .slide-background { - -webkit-transition-duration: 400ms; - transition-duration: 400ms; -} -.reveal[data-transition-speed="slow"]>.backgrounds .slide-background { - -webkit-transition-duration: 1200ms; - transition-duration: 1200ms; -} +.reveal[data-transition-speed="fast"] > .backgrounds .slide-background { + -webkit-transition-duration: 400ms; + transition-duration: 400ms; } +.reveal[data-transition-speed="slow"] > .backgrounds .slide-background { + -webkit-transition-duration: 1200ms; + transition-duration: 1200ms; } /********************************************* * 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 .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; -} +.reveal.rtl ol, .reveal.rtl ul { + text-align: right; } .reveal.rtl .progress span { - float: right -} + float: right; } /********************************************* * PARALLAX BACKGROUND *********************************************/ - .reveal.has-parallax-background .backgrounds { - -webkit-transition: all 0.8s ease; - transition: all 0.8s ease; -} + -webkit-transition: all 0.8s ease; + transition: all 0.8s ease; } /* Global transition speed settings */ .reveal.has-parallax-background[data-transition-speed="fast"] .backgrounds { - -webkit-transition-duration: 400ms; - transition-duration: 400ms; -} -.reveal.has-parallax-background[data-transition-speed="slow"] .backgrounds { - -webkit-transition-duration: 1200ms; - transition-duration: 1200ms; -} + -webkit-transition-duration: 400ms; + transition-duration: 400ms; } +.reveal.has-parallax-background[data-transition-speed="slow"] .backgrounds { + -webkit-transition-duration: 1200ms; + transition-duration: 1200ms; } /********************************************* * LINK PREVIEW OVERLAY *********************************************/ - .reveal .overlay { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - z-index: 1000; - background: rgba( 0, 0, 0, 0.9 ); - opacity: 0; - visibility: hidden; - -webkit-transition: all 0.3s ease; - transition: all 0.3s ease; -} - .reveal .overlay.visible { - opacity: 1; - visibility: visible; - } - - .reveal .overlay .spinner { - position: absolute; - display: block; - top: 50%; - left: 50%; - width: 32px; - height: 32px; - margin: -16px 0 0 -16px; - z-index: 10; - 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); - - visibility: visible; - opacity: 0.6; - -webkit-transition: all 0.3s ease; - transition: all 0.3s ease; - } - - .reveal .overlay header { - position: absolute; - left: 0; - top: 0; - width: 100%; - height: 40px; - z-index: 2; - border-bottom: 1px solid #222; - } - .reveal .overlay header a { - display: inline-block; - width: 40px; - height: 40px; - padding: 0 10px; - float: right; - opacity: 0.6; - - -moz-box-sizing: border-box; - - box-sizing: border-box; - } - .reveal .overlay header a:hover { - opacity: 1; - } - .reveal .overlay header a .icon { - display: inline-block; - width: 20px; - height: 20px; - - background-position: 50% 50%; - background-size: 100%; - background-repeat: no-repeat; - } - .reveal .overlay header a.close .icon { - background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAABkklEQVRYR8WX4VHDMAxG6wnoJrABZQPYBCaBTWAD2g1gE5gg6OOsXuxIlr40d81dfrSJ9V4c2VLK7spHuTJ/5wpM07QXuXc5X0opX2tEJcadjHuV80li/FgxTIEK/5QBCICBD6xEhSMGHgQPgBgLiYVAB1dpSqKDawxTohFw4JSEA3clzgIBPCURwE2JucBR7rhPJJv5OpJwDX+SfDjgx1wACQeJG1aChP9K/IMmdZ8DtESV1WyP3Bt4MwM6sj4NMxMYiqUWHQu4KYA/SYkIjOsm3BXYWMKFDwU2khjCQ4ELJUJ4SmClRArOCmSXGuKma0fYD5CbzHxFpCSGAhfAVSSUGDUk2BWZaff2g6GE15BsBQ9nwmpIGDiyHQddwNTMKkbZaf9fajXQca1EX44puJZUsnY0ObGmITE3GVLCbEhQUjGVt146j6oasWN+49Vph2w1pZ5EansNZqKBm1txbU57iRRcZ86RWMDdWtBJUHBHwoQPi1GV+JCbntmvok7iTX4/Up9mgyTc/FJYDTcndgH/AA5A/CHsyEkVAAAAAElFTkSuQmCC); - } - .reveal .overlay header a.external .icon { - background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAcElEQVRYR+2WSQoAIQwEzf8f7XiOMkUQxUPlGkM3hVmiQfQR9GYnH1SsAQlI4DiBqkCMoNb9y2e90IAEJPAcgdznU9+engMaeJ7Azh5Y1U67gAho4DqBqmB1buAf0MB1AlVBek83ZPkmJMGc1wAR+AAqod/B97TRpQAAAABJRU5ErkJggg==); - } - - .reveal .overlay .viewport { - position: absolute; - top: 40px; - right: 0; - bottom: 0; - left: 0; - } - - .reveal .overlay.overlay-preview .viewport iframe { - width: 100%; - height: 100%; - max-width: 100%; - max-height: 100%; - border: 0; - - opacity: 0; - visibility: hidden; - -webkit-transition: all 0.3s ease; - transition: all 0.3s ease; - } - - .reveal .overlay.overlay-preview.loaded .viewport iframe { - opacity: 1; - visibility: visible; - } - - .reveal .overlay.overlay-preview.loaded .spinner { - opacity: 0; - visibility: hidden; - -webkit-transform: scale(0.2); - -ms-transform: scale(0.2); - transform: scale(0.2); - } - - .reveal .overlay.overlay-help .viewport { - overflow: auto; - color: #fff; - } - - .reveal .overlay.overlay-help .viewport .viewport-inner { - width: 600px; - margin: 0 auto; - padding: 60px; - text-align: center; - letter-spacing: normal; - } - - .reveal .overlay.overlay-help .viewport .viewport-inner .title { - font-size: 20px; - } - - .reveal .overlay.overlay-help .viewport .viewport-inner table { - border: 1px solid #fff; - border-collapse: collapse; - font-size: 14px; - } - - .reveal .overlay.overlay-help .viewport .viewport-inner table th, - .reveal .overlay.overlay-help .viewport .viewport-inner table td { - width: 200px; - padding: 10px; - border: 1px solid #fff; - vertical-align: middle; - } - - .reveal .overlay.overlay-help .viewport .viewport-inner table th { - padding-top: 20px; - padding-bottom: 20px; - } - - + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + z-index: 1000; + background: rgba(0, 0, 0, 0.9); + opacity: 0; + visibility: hidden; + -webkit-transition: all 0.3s ease; + transition: all 0.3s ease; } + +.reveal .overlay.visible { + opacity: 1; + visibility: visible; } + +.reveal .overlay .spinner { + position: absolute; + display: block; + top: 50%; + left: 50%; + width: 32px; + height: 32px; + margin: -16px 0 0 -16px; + z-index: 10; + 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); + visibility: visible; + opacity: 0.6; + -webkit-transition: all 0.3s ease; + transition: all 0.3s ease; } + +.reveal .overlay header { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 40px; + z-index: 2; + border-bottom: 1px solid #222; } + +.reveal .overlay header a { + display: inline-block; + width: 40px; + height: 40px; + padding: 0 10px; + float: right; + opacity: 0.6; + -moz-box-sizing: border-box; + box-sizing: border-box; } + +.reveal .overlay header a:hover { + opacity: 1; } + +.reveal .overlay header a .icon { + display: inline-block; + width: 20px; + height: 20px; + background-position: 50% 50%; + background-size: 100%; + background-repeat: no-repeat; } + +.reveal .overlay header a.close .icon { + background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAABkklEQVRYR8WX4VHDMAxG6wnoJrABZQPYBCaBTWAD2g1gE5gg6OOsXuxIlr40d81dfrSJ9V4c2VLK7spHuTJ/5wpM07QXuXc5X0opX2tEJcadjHuV80li/FgxTIEK/5QBCICBD6xEhSMGHgQPgBgLiYVAB1dpSqKDawxTohFw4JSEA3clzgIBPCURwE2JucBR7rhPJJv5OpJwDX+SfDjgx1wACQeJG1aChP9K/IMmdZ8DtESV1WyP3Bt4MwM6sj4NMxMYiqUWHQu4KYA/SYkIjOsm3BXYWMKFDwU2khjCQ4ELJUJ4SmClRArOCmSXGuKma0fYD5CbzHxFpCSGAhfAVSSUGDUk2BWZaff2g6GE15BsBQ9nwmpIGDiyHQddwNTMKkbZaf9fajXQca1EX44puJZUsnY0ObGmITE3GVLCbEhQUjGVt146j6oasWN+49Vph2w1pZ5EansNZqKBm1txbU57iRRcZ86RWMDdWtBJUHBHwoQPi1GV+JCbntmvok7iTX4/Up9mgyTc/FJYDTcndgH/AA5A/CHsyEkVAAAAAElFTkSuQmCC); } + +.reveal .overlay header a.external .icon { + background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAcElEQVRYR+2WSQoAIQwEzf8f7XiOMkUQxUPlGkM3hVmiQfQR9GYnH1SsAQlI4DiBqkCMoNb9y2e90IAEJPAcgdznU9+engMaeJ7Azh5Y1U67gAho4DqBqmB1buAf0MB1AlVBek83ZPkmJMGc1wAR+AAqod/B97TRpQAAAABJRU5ErkJggg==); } + +.reveal .overlay .viewport { + position: absolute; + top: 40px; + right: 0; + bottom: 0; + left: 0; } + +.reveal .overlay.overlay-preview .viewport iframe { + width: 100%; + height: 100%; + max-width: 100%; + max-height: 100%; + border: 0; + opacity: 0; + visibility: hidden; + -webkit-transition: all 0.3s ease; + transition: all 0.3s ease; } + +.reveal .overlay.overlay-preview.loaded .viewport iframe { + opacity: 1; + visibility: visible; } + +.reveal .overlay.overlay-preview.loaded .spinner { + opacity: 0; + visibility: hidden; + -webkit-transform: scale(0.2); + -ms-transform: scale(0.2); + transform: scale(0.2); } + +.reveal .overlay.overlay-help .viewport { + overflow: auto; + color: #fff; } + +.reveal .overlay.overlay-help .viewport .viewport-inner { + width: 600px; + margin: 0 auto; + padding: 60px; + text-align: center; + letter-spacing: normal; } + +.reveal .overlay.overlay-help .viewport .viewport-inner .title { + font-size: 20px; } + +.reveal .overlay.overlay-help .viewport .viewport-inner table { + border: 1px solid #fff; + border-collapse: collapse; + font-size: 14px; } + +.reveal .overlay.overlay-help .viewport .viewport-inner table th, .reveal .overlay.overlay-help .viewport .viewport-inner table td { + width: 200px; + padding: 10px; + border: 1px solid #fff; + vertical-align: middle; } + +.reveal .overlay.overlay-help .viewport .viewport-inner table th { + padding-top: 20px; + padding-bottom: 20px; } /********************************************* * PLAYBACK COMPONENT *********************************************/ - .reveal .playback { - position: fixed; - left: 15px; - bottom: 15px; - z-index: 30; - cursor: pointer; - -webkit-transition: all 400ms ease; - transition: all 400ms ease; -} + position: fixed; + left: 15px; + bottom: 15px; + z-index: 30; + cursor: pointer; + -webkit-transition: all 400ms ease; + transition: all 400ms ease; } .reveal.overview .playback { - opacity: 0; - visibility: hidden; -} - + opacity: 0; + visibility: hidden; } /********************************************* * ROLLING LINKS *********************************************/ - .reveal .roll { - display: inline-block; - line-height: 1.2; - overflow: hidden; - - vertical-align: top; - -ms-perspective: 400px; - -webkit-perspective: 400px; - perspective: 400px; - -ms-perspective-origin: 50% 50%; - -webkit-perspective-origin: 50% 50%; - perspective-origin: 50% 50%; -} - .reveal .roll:hover { - background: none; - text-shadow: none; - } + display: inline-block; + line-height: 1.2; + overflow: hidden; + vertical-align: top; + -webkit-perspective: 400px; + perspective: 400px; + -webkit-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; - transition: all 400ms ease; - -webkit-transform-origin: 50% 0%; - -ms-transform-origin: 50% 0%; - transform-origin: 50% 0%; - -ms-transform-style: preserve-3d; - -webkit-transform-style: preserve-3d; - transform-style: preserve-3d; - -webkit-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 ); - 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-backface-visibility: hidden; - backface-visibility: hidden; - -webkit-transform-origin: 50% 0%; - -ms-transform-origin: 50% 0%; - transform-origin: 50% 0%; - -webkit-transform: translate3d( 0px, 110%, 0px ) rotateX( -90deg ); - transform: translate3d( 0px, 110%, 0px ) rotateX( -90deg ); -} + display: block; + position: relative; + padding: 0 2px; + pointer-events: none; + -webkit-transition: all 400ms ease; + transition: all 400ms ease; + -webkit-transform-origin: 50% 0%; + -ms-transform-origin: 50% 0%; + transform-origin: 50% 0%; + -webkit-transform-style: preserve-3d; + transform-style: preserve-3d; + -webkit-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); + 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-backface-visibility: hidden; + backface-visibility: hidden; + -webkit-transform-origin: 50% 0%; + -ms-transform-origin: 50% 0%; + transform-origin: 50% 0%; + -webkit-transform: translate3d(0px, 110%, 0px) rotateX(-90deg); + transform: translate3d(0px, 110%, 0px) rotateX(-90deg); } /********************************************* * SPEAKER NOTES *********************************************/ - .reveal aside.notes { - display: none; -} - + display: none; } /********************************************* * ZOOM PLUGIN *********************************************/ +.zoomed .reveal *, .zoomed .reveal *:before, .zoomed .reveal *:after { + -webkit-backface-visibility: visible !important; + backface-visibility: visible !important; } -.zoomed .reveal *, -.zoomed .reveal *:before, -.zoomed .reveal *:after { - -ms-backface-visibility: visible !important; - -webkit-backface-visibility: visible !important; - backface-visibility: visible !important; -} - -.zoomed .reveal .progress, -.zoomed .reveal .controls { - opacity: 0; -} +.zoomed .reveal .progress, .zoomed .reveal .controls { + opacity: 0; } .zoomed .reveal .roll span { - background: none; -} + background: none; } .zoomed .reveal .roll span:after { - visibility: hidden; -} - - + visibility: hidden; } diff --git a/css/reveal.bare.css b/css/reveal.scss index b025e0c..0d1fb82 100644 --- a/css/reveal.bare.css +++ b/css/reveal.scss @@ -1,5 +1,3 @@ -@charset "UTF-8"; - /*! * reveal.js * http://lab.hakim.se/reveal-js @@ -59,6 +57,12 @@ body { color: #000; } +::-moz-selection { + background: #FF5E99; + color: #fff; + text-shadow: none; +} + ::selection { background: #FF5E99; color: #fff; @@ -228,10 +232,10 @@ body { width: 0; height: 0; border: 12px solid transparent; + transform: scale(.9999); + transition: all 0.2s ease; - -moz-transform: scale(.9999); -webkit-tap-highlight-color: rgba( 0, 0, 0, 0 ); - transition: all 0.2s ease; } .reveal .controls div.enabled { @@ -357,10 +361,8 @@ body { z-index: 1; text-align: center; transition: perspective .4s ease; - -ms-perspective: 600px; - perspective: 600px; - -ms-perspective-origin: 50% 40%; - perspective-origin: 50% 40%; + perspective: 600px; + perspective-origin: 50% 40%; } .reveal .slides>section { @@ -375,12 +377,11 @@ body { padding: 20px 0px; z-index: 10; - -ms-transform-style: preserve-3d; - transform-style: preserve-3d; + transform-style: preserve-3d; 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); + 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); } /* Global transition speed settings */ @@ -445,8 +446,7 @@ body { .reveal.slide section, .reveal.linear section { - -ms-backface-visibility: hidden; - backface-visibility: hidden; + backface-visibility: hidden; } .reveal .slides>section[data-transition=slide].past, @@ -566,15 +566,13 @@ body { *********************************************/ .reveal.cube .slides { - -ms-perspective: 1300px; - perspective: 1300px; + perspective: 1300px; } .reveal.cube .slides section { padding: 30px; min-height: 700px; - -ms-backface-visibility: hidden; - backface-visibility: hidden; + backface-visibility: hidden; box-sizing: border-box; } .reveal.center.cube .slides section { @@ -639,10 +637,8 @@ body { *********************************************/ .reveal.page .slides { - -ms-perspective-origin: 0% 50%; - perspective-origin: 0% 50%; - -ms-perspective: 3000px; - perspective: 3000px; + perspective-origin: 0% 50%; + perspective: 3000px; } .reveal.page .slides section { @@ -714,7 +710,7 @@ body { .reveal .slides section[data-transition=fade], .reveal.fade .slides section:not([data-transition]), .reveal.fade .slides>section>section:not([data-transition]) { - transform: none; + transform: none; transition: opacity 0.5s; } @@ -741,10 +737,8 @@ body { *********************************************/ .reveal.overview .slides { - -ms-perspective-origin: 50% 50%; - perspective-origin: 50% 50%; - -ms-perspective: 700px; - perspective: 700px; + perspective-origin: 50% 50%; + perspective: 700px; } .reveal.overview .slides section { @@ -902,8 +896,7 @@ body { height: 100%; top: 0; left: 0; - -ms-perspective: 600px; - perspective: 600px; + perspective: 600px; } .reveal .slide-background { display: none; @@ -917,6 +910,7 @@ body { background-position: 50% 50%; background-repeat: no-repeat; background-size: cover; + transition: all 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985); } @@ -955,8 +949,7 @@ body { .reveal[data-background-transition=slide]>.backgrounds .slide-background, .reveal>.backgrounds .slide-background[data-background-transition=slide] { opacity: 1; - -ms-backface-visibility: hidden; - backface-visibility: hidden; + backface-visibility: hidden; } .reveal[data-background-transition=slide]>.backgrounds .slide-background.past, .reveal>.backgrounds .slide-background.past[data-background-transition=slide] { @@ -1285,10 +1278,8 @@ body { overflow: hidden; vertical-align: top; - -ms-perspective: 400px; - perspective: 400px; - -ms-perspective-origin: 50% 50%; - perspective-origin: 50% 50%; + perspective: 400px; + perspective-origin: 50% 50%; } .reveal .roll:hover { background: none; @@ -1302,8 +1293,7 @@ body { pointer-events: none; transition: all 400ms ease; transform-origin: 50% 0%; - -ms-transform-style: preserve-3d; - transform-style: preserve-3d; + transform-style: preserve-3d; backface-visibility: hidden; } .reveal .roll:hover span { @@ -1340,8 +1330,7 @@ body { .zoomed .reveal *, .zoomed .reveal *:before, .zoomed .reveal *:after { - -ms-backface-visibility: visible !important; - backface-visibility: visible !important; + backface-visibility: visible !important; } .zoomed .reveal .progress, diff --git a/css/theme/beige.css b/css/theme/beige.css index 685f490..83263fb 100644 --- a/css/theme/beige.css +++ b/css/theme/beige.css @@ -1,59 +1,53 @@ +@import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic); /** * Beige theme for reveal.js. * * Copyright (C) 2011-2012 Hakim El Hattab, http://hakim.se */ -@import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic); @font-face { font-family: 'League Gothic'; - src: url("../../lib/font/league_gothic-webfont.eot"); - src: url("../../lib/font/league_gothic-webfont.eot?#iefix") format("embedded-opentype"), url("../../lib/font/league_gothic-webfont.woff") format("woff"), url("../../lib/font/league_gothic-webfont.ttf") format("truetype"), url("../../lib/font/league_gothic-webfont.svg#LeagueGothicRegular") format("svg"); + src: url('../../lib/font/league_gothic-webfont.eot'); + src: url('../../lib/font/league_gothic-webfont.eot?#iefix') format('embedded-opentype'), url('../../lib/font/league_gothic-webfont.woff') format('woff'), url('../../lib/font/league_gothic-webfont.ttf') format('truetype'), url('../../lib/font/league_gothic-webfont.svg#LeagueGothicRegular') format('svg'); font-weight: normal; font-style: normal; } + /********************************************* * GLOBAL STYLES *********************************************/ body { background: #f7f2d3; - background: -moz-radial-gradient(center, circle cover, white 0%, #f7f2d3 100%); - background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, white), color-stop(100%, #f7f2d3)); - background: -webkit-radial-gradient(center, circle cover, white 0%, #f7f2d3 100%); - background: -o-radial-gradient(center, circle cover, white 0%, #f7f2d3 100%); - background: -ms-radial-gradient(center, circle cover, white 0%, #f7f2d3 100%); - background: radial-gradient(center, circle cover, white 0%, #f7f2d3 100%); + background: -moz-radial-gradient(center, circle cover, #ffffff 0%, #f7f2d3 100%); + background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, #ffffff), color-stop(100%, #f7f2d3)); + background: -webkit-radial-gradient(center, circle cover, #ffffff 0%, #f7f2d3 100%); + background: -o-radial-gradient(center, circle cover, #ffffff 0%, #f7f2d3 100%); + background: -ms-radial-gradient(center, circle cover, #ffffff 0%, #f7f2d3 100%); + background: radial-gradient(center, circle cover, #ffffff 0%, #f7f2d3 100%); background-color: #f7f3de; } .reveal { - font-family: "Lato", sans-serif; + font-family: 'Lato', sans-serif; font-size: 36px; font-weight: normal; - letter-spacing: -0.02em; - color: #333333; } + color: #333; } ::selection { - color: white; + color: #fff; background: rgba(79, 64, 28, 0.99); text-shadow: none; } -.reveal .slides > section, -.reveal .slides > section > section { - line-height: 1.2em; +.reveal .slides > section, .reveal .slides > section > section { + line-height: 1.3; font-weight: inherit; } /********************************************* * HEADERS *********************************************/ -.reveal h1, -.reveal h2, -.reveal h3, -.reveal h4, -.reveal h5, -.reveal h6 { +.reveal h1, .reveal h2, .reveal h3, .reveal h4, .reveal h5, .reveal h6 { margin: 0 0 20px 0; - color: #333333; - font-family: "League Gothic", Impact, sans-serif; - line-height: 1em; - letter-spacing: 0.02em; + color: #333; + font-family: 'League Gothic', Impact, sans-serif; + line-height: 1.2; + letter-spacing: normal; text-transform: uppercase; text-shadow: none; word-wrap: break-word; } @@ -71,32 +65,27 @@ body { font-size: 1em; } .reveal h1 { - text-shadow: 0 1px 0 #cccccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbbbbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaaaaa, 0 6px 1px rgba(0, 0, 0, 0.1), 0 0 5px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.3), 0 3px 5px rgba(0, 0, 0, 0.2), 0 5px 10px rgba(0, 0, 0, 0.25), 0 20px 20px rgba(0, 0, 0, 0.15); } + text-shadow: 0 1px 0 #ccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaa, 0 6px 1px rgba(0, 0, 0, 0.1), 0 0 5px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.3), 0 3px 5px rgba(0, 0, 0, 0.2), 0 5px 10px rgba(0, 0, 0, 0.25), 0 20px 20px rgba(0, 0, 0, 0.15); } /********************************************* * OTHER *********************************************/ .reveal p { margin-bottom: 10px; - line-height: 1.2em; } + line-height: 1.3; } /* Ensure certain elements are never larger than the slide itself */ -.reveal img, -.reveal video, -.reveal iframe { +.reveal img, .reveal video, .reveal iframe { max-width: 95%; max-height: 95%; } -.reveal strong, -.reveal b { +.reveal strong, .reveal b { font-weight: bold; } .reveal em { font-style: italic; } -.reveal ol, -.reveal dl, -.reveal ul { +.reveal ol, .reveal dl, .reveal ul { display: inline-block; text-align: left; margin: 0 0 0 1em; } @@ -113,10 +102,7 @@ body { .reveal ul ul ul { list-style-type: circle; } -.reveal ul ul, -.reveal ul ol, -.reveal ol ol, -.reveal ol ul { +.reveal ul ul, .reveal ul ol, .reveal ol ol, .reveal ol ul { display: block; margin-left: 40px; } @@ -126,8 +112,7 @@ body { .reveal dd { margin-left: 40px; } -.reveal q, -.reveal blockquote { +.reveal q, .reveal blockquote { quotes: none; } .reveal blockquote { @@ -140,8 +125,7 @@ body { 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 { +.reveal blockquote p:first-child, .reveal blockquote p:last-child { display: inline-block; } .reveal q { @@ -179,8 +163,7 @@ body { .reveal table th { font-weight: bold; } -.reveal table th, -.reveal table td { +.reveal table th, .reveal table td { text-align: left; padding: 0.2em 0.5em 0.2em 0.5em; border-bottom: 1px solid; } @@ -209,18 +192,18 @@ body { .reveal a { color: #8b743d; text-decoration: none; - -webkit-transition: color .15s ease; - -moz-transition: color .15s ease; - transition: color .15s ease; } + -webkit-transition: color 0.15s ease; + -moz-transition: color 0.15s ease; + transition: color 0.15s ease; } .reveal a:hover { - color: #c0a86e; + color: #c0a76e; text-shadow: none; border: none; } .reveal .roll span:after { color: #fff; - background: #564826; } + background: #564726; } /********************************************* * IMAGES @@ -228,13 +211,13 @@ body { .reveal section img { margin: 15px 0px; background: rgba(255, 255, 255, 0.12); - border: 4px solid #333333; + border: 4px solid #333; box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); } .reveal a img { - -webkit-transition: all .15s linear; - -moz-transition: all .15s linear; - transition: all .15s linear; } + -webkit-transition: all 0.15s linear; + -moz-transition: all 0.15s linear; + transition: all 0.15s linear; } .reveal a:hover img { background: rgba(255, 255, 255, 0.2); @@ -244,33 +227,29 @@ body { /********************************************* * NAVIGATION CONTROLS *********************************************/ -.reveal .controls div.navigate-left, -.reveal .controls div.navigate-left.enabled { +.reveal .controls div.navigate-left, .reveal .controls div.navigate-left.enabled { border-right-color: #8b743d; } -.reveal .controls div.navigate-right, -.reveal .controls div.navigate-right.enabled { +.reveal .controls div.navigate-right, .reveal .controls div.navigate-right.enabled { border-left-color: #8b743d; } -.reveal .controls div.navigate-up, -.reveal .controls div.navigate-up.enabled { +.reveal .controls div.navigate-up, .reveal .controls div.navigate-up.enabled { border-bottom-color: #8b743d; } -.reveal .controls div.navigate-down, -.reveal .controls div.navigate-down.enabled { +.reveal .controls div.navigate-down, .reveal .controls div.navigate-down.enabled { border-top-color: #8b743d; } .reveal .controls div.navigate-left.enabled:hover { - border-right-color: #c0a86e; } + border-right-color: #c0a76e; } .reveal .controls div.navigate-right.enabled:hover { - border-left-color: #c0a86e; } + border-left-color: #c0a76e; } .reveal .controls div.navigate-up.enabled:hover { - border-bottom-color: #c0a86e; } + border-bottom-color: #c0a76e; } .reveal .controls div.navigate-down.enabled:hover { - border-top-color: #c0a86e; } + border-top-color: #c0a76e; } /********************************************* * PROGRESS BAR diff --git a/css/theme/black.css b/css/theme/black.css new file mode 100644 index 0000000..a790d86 --- /dev/null +++ b/css/theme/black.css @@ -0,0 +1,258 @@ +@import url(https://fonts.googleapis.com/css?family=Montserrat:400); +@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700,400italic,700italic); +/** + * Black theme for reveal.js. + * + * Copyright (C) 2014 Hakim El Hattab, http://hakim.se + */ +/********************************************* + * GLOBAL STYLES + *********************************************/ +body { + background: #111; + background-color: #111; } + +.reveal { + font-family: 'Open Sans', Helvetica, sans-serif; + font-size: 34px; + font-weight: normal; + color: #fff; } + +::selection { + color: #fff; + background: #b6d7fe; + text-shadow: none; } + +.reveal .slides > section, .reveal .slides > section > section { + line-height: 1.3; + font-weight: inherit; } + +/********************************************* + * HEADERS + *********************************************/ +.reveal h1, .reveal h2, .reveal h3, .reveal h4, .reveal h5, .reveal h6 { + margin: 0 0 20px 0; + color: #fff; + font-family: 'Montserrat', Helvetica, sans-serif; + line-height: 1.2; + letter-spacing: normal; + text-transform: uppercase; + text-shadow: none; + word-wrap: break-word; } + +.reveal h1 { + font-size: 2.8em; } + +.reveal h2 { + font-size: 1.8em; } + +.reveal h3 { + font-size: 1.5em; } + +.reveal h4 { + font-size: 1em; } + +.reveal h1 { + text-shadow: none; } + +/********************************************* + * OTHER + *********************************************/ +.reveal p { + margin-bottom: 10px; + line-height: 1.3; } + +/* Ensure certain elements are never larger than the slide itself */ +.reveal img, .reveal video, .reveal iframe { + max-width: 95%; + max-height: 95%; } + +.reveal strong, .reveal b { + font-weight: bold; } + +.reveal em { + font-style: italic; } + +.reveal ol, .reveal dl, .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 dt { + font-weight: bold; } + +.reveal dd { + margin-left: 40px; } + +.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 q { + font-style: italic; } + +.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 code { + font-family: monospace; } + +.reveal pre code { + display: block; + padding: 5px; + overflow: auto; + max-height: 400px; + word-wrap: normal; + background: #3F3F3F; + color: #DCDCDC; } + +.reveal table { + margin: auto; + border-collapse: collapse; + border-spacing: 0; } + +.reveal table th { + font-weight: bold; } + +.reveal table th, .reveal table td { + text-align: left; + padding: 0.2em 0.5em 0.2em 0.5em; + border-bottom: 1px solid; } + +.reveal table tr:last-child td { + border-bottom: none; } + +.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; } + +/********************************************* + * LINKS + *********************************************/ +.reveal a { + color: #3992fb; + text-decoration: none; + -webkit-transition: color 0.15s ease; + -moz-transition: color 0.15s ease; + transition: color 0.15s ease; } + +.reveal a:hover { + color: #84bcfd; + text-shadow: none; + border: none; } + +.reveal .roll span:after { + color: #fff; + background: #056ce3; } + +/********************************************* + * IMAGES + *********************************************/ +.reveal section img { + margin: 15px 0px; + background: rgba(255, 255, 255, 0.12); + border: 4px solid #fff; + box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); } + +.reveal a img { + -webkit-transition: all 0.15s linear; + -moz-transition: all 0.15s linear; + transition: all 0.15s linear; } + +.reveal a:hover img { + background: rgba(255, 255, 255, 0.2); + border-color: #3992fb; + box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); } + +/********************************************* + * NAVIGATION CONTROLS + *********************************************/ +.reveal .controls div.navigate-left, .reveal .controls div.navigate-left.enabled { + border-right-color: #3992fb; } + +.reveal .controls div.navigate-right, .reveal .controls div.navigate-right.enabled { + border-left-color: #3992fb; } + +.reveal .controls div.navigate-up, .reveal .controls div.navigate-up.enabled { + border-bottom-color: #3992fb; } + +.reveal .controls div.navigate-down, .reveal .controls div.navigate-down.enabled { + border-top-color: #3992fb; } + +.reveal .controls div.navigate-left.enabled:hover { + border-right-color: #84bcfd; } + +.reveal .controls div.navigate-right.enabled:hover { + border-left-color: #84bcfd; } + +.reveal .controls div.navigate-up.enabled:hover { + border-bottom-color: #84bcfd; } + +.reveal .controls div.navigate-down.enabled:hover { + border-top-color: #84bcfd; } + +/********************************************* + * PROGRESS BAR + *********************************************/ +.reveal .progress { + background: rgba(0, 0, 0, 0.2); } + +.reveal .progress span { + background: #3992fb; + -webkit-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); + -moz-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); + transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); } + +/********************************************* + * SLIDE NUMBER + *********************************************/ +.reveal .slide-number { + color: #3992fb; } diff --git a/css/theme/blood.css b/css/theme/blood.css index a29b11d..d73dc2f 100644 --- a/css/theme/blood.css +++ b/css/theme/blood.css @@ -1,3 +1,4 @@ +@import url(https://fonts.googleapis.com/css?family=Ubuntu:300,700,300italic,700italic); /** * Blood theme for reveal.js * Author: Walther http://github.com/Walther @@ -9,53 +10,45 @@ * For other themes, change $codeBackground accordingly. * */ -@import url(https://fonts.googleapis.com/css?family=Ubuntu:300,700,300italic,700italic); /********************************************* * GLOBAL STYLES *********************************************/ body { - background: #222222; - background: -moz-radial-gradient(center, circle cover, #626262 0%, #222222 100%); - background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, #626262), color-stop(100%, #222222)); - background: -webkit-radial-gradient(center, circle cover, #626262 0%, #222222 100%); - background: -o-radial-gradient(center, circle cover, #626262 0%, #222222 100%); - background: -ms-radial-gradient(center, circle cover, #626262 0%, #222222 100%); - background: radial-gradient(center, circle cover, #626262 0%, #222222 100%); + background: #222; + background: -moz-radial-gradient(center, circle cover, #626262 0%, #222 100%); + background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, #626262), color-stop(100%, #222)); + background: -webkit-radial-gradient(center, circle cover, #626262 0%, #222 100%); + background: -o-radial-gradient(center, circle cover, #626262 0%, #222 100%); + background: -ms-radial-gradient(center, circle cover, #626262 0%, #222 100%); + background: radial-gradient(center, circle cover, #626262 0%, #222 100%); background-color: #2b2b2b; } .reveal { - font-family: Ubuntu, "sans-serif"; + font-family: Ubuntu, 'sans-serif'; font-size: 36px; font-weight: normal; - letter-spacing: -0.02em; - color: #eeeeee; } + color: #eee; } ::selection { - color: white; - background: #aa2233; + color: #fff; + background: #a23; text-shadow: none; } -.reveal .slides > section, -.reveal .slides > section > section { - line-height: 1.2em; +.reveal .slides > section, .reveal .slides > section > section { + line-height: 1.3; font-weight: inherit; } /********************************************* * HEADERS *********************************************/ -.reveal h1, -.reveal h2, -.reveal h3, -.reveal h4, -.reveal h5, -.reveal h6 { +.reveal h1, .reveal h2, .reveal h3, .reveal h4, .reveal h5, .reveal h6 { margin: 0 0 20px 0; - color: #eeeeee; - font-family: Ubuntu, "sans-serif"; - line-height: 1em; - letter-spacing: 0.02em; + color: #eee; + font-family: Ubuntu, 'sans-serif'; + line-height: 1.2; + letter-spacing: normal; text-transform: uppercase; - text-shadow: 2px 2px 2px #222222; + text-shadow: 2px 2px 2px #222; word-wrap: break-word; } .reveal h1 { @@ -71,32 +64,27 @@ body { font-size: 1em; } .reveal h1 { - text-shadow: 0 1px 0 #cccccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbbbbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaaaaa, 0 6px 1px rgba(0, 0, 0, 0.1), 0 0 5px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.3), 0 3px 5px rgba(0, 0, 0, 0.2), 0 5px 10px rgba(0, 0, 0, 0.25), 0 20px 20px rgba(0, 0, 0, 0.15); } + text-shadow: 0 1px 0 #ccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaa, 0 6px 1px rgba(0, 0, 0, 0.1), 0 0 5px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.3), 0 3px 5px rgba(0, 0, 0, 0.2), 0 5px 10px rgba(0, 0, 0, 0.25), 0 20px 20px rgba(0, 0, 0, 0.15); } /********************************************* * OTHER *********************************************/ .reveal p { margin-bottom: 10px; - line-height: 1.2em; } + line-height: 1.3; } /* Ensure certain elements are never larger than the slide itself */ -.reveal img, -.reveal video, -.reveal iframe { +.reveal img, .reveal video, .reveal iframe { max-width: 95%; max-height: 95%; } -.reveal strong, -.reveal b { +.reveal strong, .reveal b { font-weight: bold; } .reveal em { font-style: italic; } -.reveal ol, -.reveal dl, -.reveal ul { +.reveal ol, .reveal dl, .reveal ul { display: inline-block; text-align: left; margin: 0 0 0 1em; } @@ -113,10 +101,7 @@ body { .reveal ul ul ul { list-style-type: circle; } -.reveal ul ul, -.reveal ul ol, -.reveal ol ol, -.reveal ol ul { +.reveal ul ul, .reveal ul ol, .reveal ol ol, .reveal ol ul { display: block; margin-left: 40px; } @@ -126,8 +111,7 @@ body { .reveal dd { margin-left: 40px; } -.reveal q, -.reveal blockquote { +.reveal q, .reveal blockquote { quotes: none; } .reveal blockquote { @@ -140,8 +124,7 @@ body { 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 { +.reveal blockquote p:first-child, .reveal blockquote p:last-child { display: inline-block; } .reveal q { @@ -179,8 +162,7 @@ body { .reveal table th { font-weight: bold; } -.reveal table th, -.reveal table td { +.reveal table th, .reveal table td { text-align: left; padding: 0.2em 0.5em 0.2em 0.5em; border-bottom: 1px solid; } @@ -207,20 +189,20 @@ body { * LINKS *********************************************/ .reveal a { - color: #aa2233; + color: #a23; text-decoration: none; - -webkit-transition: color .15s ease; - -moz-transition: color .15s ease; - transition: color .15s ease; } + -webkit-transition: color 0.15s ease; + -moz-transition: color 0.15s ease; + transition: color 0.15s ease; } .reveal a:hover { - color: #dd5566; + color: #dd5567; text-shadow: none; border: none; } .reveal .roll span:after { color: #fff; - background: #6a1520; } + background: #6a1521; } /********************************************* * IMAGES @@ -228,49 +210,45 @@ body { .reveal section img { margin: 15px 0px; background: rgba(255, 255, 255, 0.12); - border: 4px solid #eeeeee; + border: 4px solid #eee; box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); } .reveal a img { - -webkit-transition: all .15s linear; - -moz-transition: all .15s linear; - transition: all .15s linear; } + -webkit-transition: all 0.15s linear; + -moz-transition: all 0.15s linear; + transition: all 0.15s linear; } .reveal a:hover img { background: rgba(255, 255, 255, 0.2); - border-color: #aa2233; + border-color: #a23; box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); } /********************************************* * NAVIGATION CONTROLS *********************************************/ -.reveal .controls div.navigate-left, -.reveal .controls div.navigate-left.enabled { - border-right-color: #aa2233; } +.reveal .controls div.navigate-left, .reveal .controls div.navigate-left.enabled { + border-right-color: #a23; } -.reveal .controls div.navigate-right, -.reveal .controls div.navigate-right.enabled { - border-left-color: #aa2233; } +.reveal .controls div.navigate-right, .reveal .controls div.navigate-right.enabled { + border-left-color: #a23; } -.reveal .controls div.navigate-up, -.reveal .controls div.navigate-up.enabled { - border-bottom-color: #aa2233; } +.reveal .controls div.navigate-up, .reveal .controls div.navigate-up.enabled { + border-bottom-color: #a23; } -.reveal .controls div.navigate-down, -.reveal .controls div.navigate-down.enabled { - border-top-color: #aa2233; } +.reveal .controls div.navigate-down, .reveal .controls div.navigate-down.enabled { + border-top-color: #a23; } .reveal .controls div.navigate-left.enabled:hover { - border-right-color: #dd5566; } + border-right-color: #dd5567; } .reveal .controls div.navigate-right.enabled:hover { - border-left-color: #dd5566; } + border-left-color: #dd5567; } .reveal .controls div.navigate-up.enabled:hover { - border-bottom-color: #dd5566; } + border-bottom-color: #dd5567; } .reveal .controls div.navigate-down.enabled:hover { - border-top-color: #dd5566; } + border-top-color: #dd5567; } /********************************************* * PROGRESS BAR @@ -279,7 +257,7 @@ body { background: rgba(0, 0, 0, 0.2); } .reveal .progress span { - background: #aa2233; + background: #a23; -webkit-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); -moz-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); } @@ -288,26 +266,19 @@ body { * SLIDE NUMBER *********************************************/ .reveal .slide-number { - color: #aa2233; } + color: #a23; } .reveal p { font-weight: 300; - text-shadow: 1px 1px #222222; } - -.reveal h1, -.reveal h2, -.reveal h3, -.reveal h4, -.reveal h5, -.reveal h6 { + text-shadow: 1px 1px #222; } + +.reveal h1, .reveal h2, .reveal h3, .reveal h4, .reveal h5, .reveal h6 { font-weight: 700; } -.reveal a, -.reveal a:hover { +.reveal a, .reveal a:hover { text-shadow: 2px 2px 2px #000; } -.reveal small a, -.reveal small a:hover { +.reveal small a, .reveal small a:hover { text-shadow: 1px 1px 1px #000; } .reveal p code { diff --git a/css/theme/default.css b/css/theme/default.css index 708bfa4..8e064bf 100644 --- a/css/theme/default.css +++ b/css/theme/default.css @@ -1,15 +1,16 @@ +@import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic); /** * Default theme for reveal.js. * * Copyright (C) 2011-2012 Hakim El Hattab, http://hakim.se */ -@import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic); @font-face { font-family: 'League Gothic'; - src: url("../../lib/font/league_gothic-webfont.eot"); - src: url("../../lib/font/league_gothic-webfont.eot?#iefix") format("embedded-opentype"), url("../../lib/font/league_gothic-webfont.woff") format("woff"), url("../../lib/font/league_gothic-webfont.ttf") format("truetype"), url("../../lib/font/league_gothic-webfont.svg#LeagueGothicRegular") format("svg"); + src: url('../../lib/font/league_gothic-webfont.eot'); + src: url('../../lib/font/league_gothic-webfont.eot?#iefix') format('embedded-opentype'), url('../../lib/font/league_gothic-webfont.woff') format('woff'), url('../../lib/font/league_gothic-webfont.ttf') format('truetype'), url('../../lib/font/league_gothic-webfont.svg#LeagueGothicRegular') format('svg'); font-weight: normal; font-style: normal; } + /********************************************* * GLOBAL STYLES *********************************************/ @@ -24,36 +25,29 @@ body { background-color: #2b2b2b; } .reveal { - font-family: "Lato", sans-serif; + font-family: 'Lato', sans-serif; font-size: 36px; font-weight: normal; - letter-spacing: -0.02em; - color: #eeeeee; } + color: #eee; } ::selection { - color: white; - background: #ff5e99; + color: #fff; + background: #FF5E99; text-shadow: none; } -.reveal .slides > section, -.reveal .slides > section > section { - line-height: 1.2em; +.reveal .slides > section, .reveal .slides > section > section { + line-height: 1.3; font-weight: inherit; } /********************************************* * HEADERS *********************************************/ -.reveal h1, -.reveal h2, -.reveal h3, -.reveal h4, -.reveal h5, -.reveal h6 { +.reveal h1, .reveal h2, .reveal h3, .reveal h4, .reveal h5, .reveal h6 { margin: 0 0 20px 0; - color: #eeeeee; - font-family: "League Gothic", Impact, sans-serif; - line-height: 1em; - letter-spacing: 0.02em; + color: #eee; + font-family: 'League Gothic', Impact, sans-serif; + line-height: 1.2; + letter-spacing: normal; text-transform: uppercase; text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.2); word-wrap: break-word; } @@ -71,32 +65,27 @@ body { font-size: 1em; } .reveal h1 { - text-shadow: 0 1px 0 #cccccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbbbbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaaaaa, 0 6px 1px rgba(0, 0, 0, 0.1), 0 0 5px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.3), 0 3px 5px rgba(0, 0, 0, 0.2), 0 5px 10px rgba(0, 0, 0, 0.25), 0 20px 20px rgba(0, 0, 0, 0.15); } + text-shadow: 0 1px 0 #ccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaa, 0 6px 1px rgba(0, 0, 0, 0.1), 0 0 5px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.3), 0 3px 5px rgba(0, 0, 0, 0.2), 0 5px 10px rgba(0, 0, 0, 0.25), 0 20px 20px rgba(0, 0, 0, 0.15); } /********************************************* * OTHER *********************************************/ .reveal p { margin-bottom: 10px; - line-height: 1.2em; } + line-height: 1.3; } /* Ensure certain elements are never larger than the slide itself */ -.reveal img, -.reveal video, -.reveal iframe { +.reveal img, .reveal video, .reveal iframe { max-width: 95%; max-height: 95%; } -.reveal strong, -.reveal b { +.reveal strong, .reveal b { font-weight: bold; } .reveal em { font-style: italic; } -.reveal ol, -.reveal dl, -.reveal ul { +.reveal ol, .reveal dl, .reveal ul { display: inline-block; text-align: left; margin: 0 0 0 1em; } @@ -113,10 +102,7 @@ body { .reveal ul ul ul { list-style-type: circle; } -.reveal ul ul, -.reveal ul ol, -.reveal ol ol, -.reveal ol ul { +.reveal ul ul, .reveal ul ol, .reveal ol ol, .reveal ol ul { display: block; margin-left: 40px; } @@ -126,8 +112,7 @@ body { .reveal dd { margin-left: 40px; } -.reveal q, -.reveal blockquote { +.reveal q, .reveal blockquote { quotes: none; } .reveal blockquote { @@ -140,8 +125,7 @@ body { 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 { +.reveal blockquote p:first-child, .reveal blockquote p:last-child { display: inline-block; } .reveal q { @@ -179,8 +163,7 @@ body { .reveal table th { font-weight: bold; } -.reveal table th, -.reveal table td { +.reveal table th, .reveal table td { text-align: left; padding: 0.2em 0.5em 0.2em 0.5em; border-bottom: 1px solid; } @@ -207,20 +190,20 @@ body { * LINKS *********************************************/ .reveal a { - color: #13daec; + color: #13DAEC; text-decoration: none; - -webkit-transition: color .15s ease; - -moz-transition: color .15s ease; - transition: color .15s ease; } + -webkit-transition: color 0.15s ease; + -moz-transition: color 0.15s ease; + transition: color 0.15s ease; } .reveal a:hover { - color: #71e9f4; + color: #71ebf4; text-shadow: none; border: none; } .reveal .roll span:after { color: #fff; - background: #0d99a5; } + background: #0d9ba5; } /********************************************* * IMAGES @@ -228,49 +211,45 @@ body { .reveal section img { margin: 15px 0px; background: rgba(255, 255, 255, 0.12); - border: 4px solid #eeeeee; + border: 4px solid #eee; box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); } .reveal a img { - -webkit-transition: all .15s linear; - -moz-transition: all .15s linear; - transition: all .15s linear; } + -webkit-transition: all 0.15s linear; + -moz-transition: all 0.15s linear; + transition: all 0.15s linear; } .reveal a:hover img { background: rgba(255, 255, 255, 0.2); - border-color: #13daec; + border-color: #13DAEC; box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); } /********************************************* * NAVIGATION CONTROLS *********************************************/ -.reveal .controls div.navigate-left, -.reveal .controls div.navigate-left.enabled { - border-right-color: #13daec; } +.reveal .controls div.navigate-left, .reveal .controls div.navigate-left.enabled { + border-right-color: #13DAEC; } -.reveal .controls div.navigate-right, -.reveal .controls div.navigate-right.enabled { - border-left-color: #13daec; } +.reveal .controls div.navigate-right, .reveal .controls div.navigate-right.enabled { + border-left-color: #13DAEC; } -.reveal .controls div.navigate-up, -.reveal .controls div.navigate-up.enabled { - border-bottom-color: #13daec; } +.reveal .controls div.navigate-up, .reveal .controls div.navigate-up.enabled { + border-bottom-color: #13DAEC; } -.reveal .controls div.navigate-down, -.reveal .controls div.navigate-down.enabled { - border-top-color: #13daec; } +.reveal .controls div.navigate-down, .reveal .controls div.navigate-down.enabled { + border-top-color: #13DAEC; } .reveal .controls div.navigate-left.enabled:hover { - border-right-color: #71e9f4; } + border-right-color: #71ebf4; } .reveal .controls div.navigate-right.enabled:hover { - border-left-color: #71e9f4; } + border-left-color: #71ebf4; } .reveal .controls div.navigate-up.enabled:hover { - border-bottom-color: #71e9f4; } + border-bottom-color: #71ebf4; } .reveal .controls div.navigate-down.enabled:hover { - border-top-color: #71e9f4; } + border-top-color: #71ebf4; } /********************************************* * PROGRESS BAR @@ -279,7 +258,7 @@ body { background: rgba(0, 0, 0, 0.2); } .reveal .progress span { - background: #13daec; + background: #13DAEC; -webkit-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); -moz-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); } @@ -288,4 +267,4 @@ body { * SLIDE NUMBER *********************************************/ .reveal .slide-number { - color: #13daec; } + color: #13DAEC; } diff --git a/css/theme/moon.css b/css/theme/moon.css index a7b236b..d90616a 100644 --- a/css/theme/moon.css +++ b/css/theme/moon.css @@ -1,14 +1,15 @@ +@import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic); /** * Solarized Dark theme for reveal.js. * Author: Achim Staebler */ -@import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic); @font-face { font-family: 'League Gothic'; - src: url("../../lib/font/league_gothic-webfont.eot"); - src: url("../../lib/font/league_gothic-webfont.eot?#iefix") format("embedded-opentype"), url("../../lib/font/league_gothic-webfont.woff") format("woff"), url("../../lib/font/league_gothic-webfont.ttf") format("truetype"), url("../../lib/font/league_gothic-webfont.svg#LeagueGothicRegular") format("svg"); + src: url('../../lib/font/league_gothic-webfont.eot'); + src: url('../../lib/font/league_gothic-webfont.eot?#iefix') format('embedded-opentype'), url('../../lib/font/league_gothic-webfont.woff') format('woff'), url('../../lib/font/league_gothic-webfont.ttf') format('truetype'), url('../../lib/font/league_gothic-webfont.svg#LeagueGothicRegular') format('svg'); font-weight: normal; font-style: normal; } + /** * Solarized colors by Ethan Schoonover */ @@ -24,36 +25,29 @@ body { background-color: #002b36; } .reveal { - font-family: "Lato", sans-serif; + font-family: 'Lato', sans-serif; font-size: 36px; font-weight: normal; - letter-spacing: -0.02em; color: #93a1a1; } ::selection { - color: white; + color: #fff; background: #d33682; text-shadow: none; } -.reveal .slides > section, -.reveal .slides > section > section { - line-height: 1.2em; +.reveal .slides > section, .reveal .slides > section > section { + line-height: 1.3; font-weight: inherit; } /********************************************* * HEADERS *********************************************/ -.reveal h1, -.reveal h2, -.reveal h3, -.reveal h4, -.reveal h5, -.reveal h6 { +.reveal h1, .reveal h2, .reveal h3, .reveal h4, .reveal h5, .reveal h6 { margin: 0 0 20px 0; color: #eee8d5; - font-family: "League Gothic", Impact, sans-serif; - line-height: 1em; - letter-spacing: 0.02em; + font-family: 'League Gothic', Impact, sans-serif; + line-height: 1.2; + letter-spacing: normal; text-transform: uppercase; text-shadow: none; word-wrap: break-word; } @@ -71,32 +65,27 @@ body { font-size: 1em; } .reveal h1 { - text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.2); } + text-shadow: none; } /********************************************* * OTHER *********************************************/ .reveal p { margin-bottom: 10px; - line-height: 1.2em; } + line-height: 1.3; } /* Ensure certain elements are never larger than the slide itself */ -.reveal img, -.reveal video, -.reveal iframe { +.reveal img, .reveal video, .reveal iframe { max-width: 95%; max-height: 95%; } -.reveal strong, -.reveal b { +.reveal strong, .reveal b { font-weight: bold; } .reveal em { font-style: italic; } -.reveal ol, -.reveal dl, -.reveal ul { +.reveal ol, .reveal dl, .reveal ul { display: inline-block; text-align: left; margin: 0 0 0 1em; } @@ -113,10 +102,7 @@ body { .reveal ul ul ul { list-style-type: circle; } -.reveal ul ul, -.reveal ul ol, -.reveal ol ol, -.reveal ol ul { +.reveal ul ul, .reveal ul ol, .reveal ol ol, .reveal ol ul { display: block; margin-left: 40px; } @@ -126,8 +112,7 @@ body { .reveal dd { margin-left: 40px; } -.reveal q, -.reveal blockquote { +.reveal q, .reveal blockquote { quotes: none; } .reveal blockquote { @@ -140,8 +125,7 @@ body { 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 { +.reveal blockquote p:first-child, .reveal blockquote p:last-child { display: inline-block; } .reveal q { @@ -179,8 +163,7 @@ body { .reveal table th { font-weight: bold; } -.reveal table th, -.reveal table td { +.reveal table th, .reveal table td { text-align: left; padding: 0.2em 0.5em 0.2em 0.5em; border-bottom: 1px solid; } @@ -209,18 +192,18 @@ body { .reveal a { color: #268bd2; text-decoration: none; - -webkit-transition: color .15s ease; - -moz-transition: color .15s ease; - transition: color .15s ease; } + -webkit-transition: color 0.15s ease; + -moz-transition: color 0.15s ease; + transition: color 0.15s ease; } .reveal a:hover { - color: #78b9e6; + color: #78bae6; text-shadow: none; border: none; } .reveal .roll span:after { color: #fff; - background: #1a6091; } + background: #1a6291; } /********************************************* * IMAGES @@ -232,9 +215,9 @@ body { box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); } .reveal a img { - -webkit-transition: all .15s linear; - -moz-transition: all .15s linear; - transition: all .15s linear; } + -webkit-transition: all 0.15s linear; + -moz-transition: all 0.15s linear; + transition: all 0.15s linear; } .reveal a:hover img { background: rgba(255, 255, 255, 0.2); @@ -244,33 +227,29 @@ body { /********************************************* * NAVIGATION CONTROLS *********************************************/ -.reveal .controls div.navigate-left, -.reveal .controls div.navigate-left.enabled { +.reveal .controls div.navigate-left, .reveal .controls div.navigate-left.enabled { border-right-color: #268bd2; } -.reveal .controls div.navigate-right, -.reveal .controls div.navigate-right.enabled { +.reveal .controls div.navigate-right, .reveal .controls div.navigate-right.enabled { border-left-color: #268bd2; } -.reveal .controls div.navigate-up, -.reveal .controls div.navigate-up.enabled { +.reveal .controls div.navigate-up, .reveal .controls div.navigate-up.enabled { border-bottom-color: #268bd2; } -.reveal .controls div.navigate-down, -.reveal .controls div.navigate-down.enabled { +.reveal .controls div.navigate-down, .reveal .controls div.navigate-down.enabled { border-top-color: #268bd2; } .reveal .controls div.navigate-left.enabled:hover { - border-right-color: #78b9e6; } + border-right-color: #78bae6; } .reveal .controls div.navigate-right.enabled:hover { - border-left-color: #78b9e6; } + border-left-color: #78bae6; } .reveal .controls div.navigate-up.enabled:hover { - border-bottom-color: #78b9e6; } + border-bottom-color: #78bae6; } .reveal .controls div.navigate-down.enabled:hover { - border-top-color: #78b9e6; } + border-top-color: #78bae6; } /********************************************* * PROGRESS BAR diff --git a/css/theme/night.css b/css/theme/night.css index ec48802..69dd224 100644 --- a/css/theme/night.css +++ b/css/theme/night.css @@ -1,47 +1,40 @@ +@import url(https://fonts.googleapis.com/css?family=Montserrat:700); +@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700,400italic,700italic); /** * Black theme for reveal.js. * * Copyright (C) 2011-2012 Hakim El Hattab, http://hakim.se */ -@import url(https://fonts.googleapis.com/css?family=Montserrat:700); -@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700,400italic,700italic); /********************************************* * GLOBAL STYLES *********************************************/ body { - background: #111111; - background-color: #111111; } + background: #111; + background-color: #111; } .reveal { - font-family: "Open Sans", sans-serif; + font-family: 'Open Sans', sans-serif; font-size: 30px; font-weight: normal; - letter-spacing: -0.02em; - color: #eeeeee; } + color: #eee; } ::selection { - color: white; + color: #fff; background: #e7ad52; text-shadow: none; } -.reveal .slides > section, -.reveal .slides > section > section { - line-height: 1.2em; +.reveal .slides > section, .reveal .slides > section > section { + line-height: 1.3; font-weight: inherit; } /********************************************* * HEADERS *********************************************/ -.reveal h1, -.reveal h2, -.reveal h3, -.reveal h4, -.reveal h5, -.reveal h6 { +.reveal h1, .reveal h2, .reveal h3, .reveal h4, .reveal h5, .reveal h6 { margin: 0 0 20px 0; - color: #eeeeee; - font-family: "Montserrat", Impact, sans-serif; - line-height: 1em; + color: #eee; + font-family: 'Montserrat', Impact, sans-serif; + line-height: 1.2; letter-spacing: -0.03em; text-transform: none; text-shadow: none; @@ -60,32 +53,27 @@ body { font-size: 1em; } .reveal h1 { - text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.2); } + text-shadow: none; } /********************************************* * OTHER *********************************************/ .reveal p { margin-bottom: 10px; - line-height: 1.2em; } + line-height: 1.3; } /* Ensure certain elements are never larger than the slide itself */ -.reveal img, -.reveal video, -.reveal iframe { +.reveal img, .reveal video, .reveal iframe { max-width: 95%; max-height: 95%; } -.reveal strong, -.reveal b { +.reveal strong, .reveal b { font-weight: bold; } .reveal em { font-style: italic; } -.reveal ol, -.reveal dl, -.reveal ul { +.reveal ol, .reveal dl, .reveal ul { display: inline-block; text-align: left; margin: 0 0 0 1em; } @@ -102,10 +90,7 @@ body { .reveal ul ul ul { list-style-type: circle; } -.reveal ul ul, -.reveal ul ol, -.reveal ol ol, -.reveal ol ul { +.reveal ul ul, .reveal ul ol, .reveal ol ol, .reveal ol ul { display: block; margin-left: 40px; } @@ -115,8 +100,7 @@ body { .reveal dd { margin-left: 40px; } -.reveal q, -.reveal blockquote { +.reveal q, .reveal blockquote { quotes: none; } .reveal blockquote { @@ -129,8 +113,7 @@ body { 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 { +.reveal blockquote p:first-child, .reveal blockquote p:last-child { display: inline-block; } .reveal q { @@ -168,8 +151,7 @@ body { .reveal table th { font-weight: bold; } -.reveal table th, -.reveal table td { +.reveal table th, .reveal table td { text-align: left; padding: 0.2em 0.5em 0.2em 0.5em; border-bottom: 1px solid; } @@ -198,9 +180,9 @@ body { .reveal a { color: #e7ad52; text-decoration: none; - -webkit-transition: color .15s ease; - -moz-transition: color .15s ease; - transition: color .15s ease; } + -webkit-transition: color 0.15s ease; + -moz-transition: color 0.15s ease; + transition: color 0.15s ease; } .reveal a:hover { color: #f3d7ac; @@ -209,7 +191,7 @@ body { .reveal .roll span:after { color: #fff; - background: #d08a1d; } + background: #d0881d; } /********************************************* * IMAGES @@ -217,13 +199,13 @@ body { .reveal section img { margin: 15px 0px; background: rgba(255, 255, 255, 0.12); - border: 4px solid #eeeeee; + border: 4px solid #eee; box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); } .reveal a img { - -webkit-transition: all .15s linear; - -moz-transition: all .15s linear; - transition: all .15s linear; } + -webkit-transition: all 0.15s linear; + -moz-transition: all 0.15s linear; + transition: all 0.15s linear; } .reveal a:hover img { background: rgba(255, 255, 255, 0.2); @@ -233,20 +215,16 @@ body { /********************************************* * NAVIGATION CONTROLS *********************************************/ -.reveal .controls div.navigate-left, -.reveal .controls div.navigate-left.enabled { +.reveal .controls div.navigate-left, .reveal .controls div.navigate-left.enabled { border-right-color: #e7ad52; } -.reveal .controls div.navigate-right, -.reveal .controls div.navigate-right.enabled { +.reveal .controls div.navigate-right, .reveal .controls div.navigate-right.enabled { border-left-color: #e7ad52; } -.reveal .controls div.navigate-up, -.reveal .controls div.navigate-up.enabled { +.reveal .controls div.navigate-up, .reveal .controls div.navigate-up.enabled { border-bottom-color: #e7ad52; } -.reveal .controls div.navigate-down, -.reveal .controls div.navigate-down.enabled { +.reveal .controls div.navigate-down, .reveal .controls div.navigate-down.enabled { border-top-color: #e7ad52; } .reveal .controls div.navigate-left.enabled:hover { diff --git a/css/theme/serif.css b/css/theme/serif.css index a060bc8..28171ad 100644 --- a/css/theme/serif.css +++ b/css/theme/serif.css @@ -11,40 +11,33 @@ * GLOBAL STYLES *********************************************/ body { - background: #f0f1eb; - background-color: #f0f1eb; } + background: #F0F1EB; + background-color: #F0F1EB; } .reveal { - font-family: "Palatino Linotype", "Book Antiqua", Palatino, FreeSerif, serif; + font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, FreeSerif, serif; font-size: 36px; font-weight: normal; - letter-spacing: -0.02em; - color: black; } + color: #000; } ::selection { - color: white; - background: #26351c; + color: #fff; + background: #26351C; text-shadow: none; } -.reveal .slides > section, -.reveal .slides > section > section { - line-height: 1.2em; +.reveal .slides > section, .reveal .slides > section > section { + line-height: 1.3; font-weight: inherit; } /********************************************* * HEADERS *********************************************/ -.reveal h1, -.reveal h2, -.reveal h3, -.reveal h4, -.reveal h5, -.reveal h6 { +.reveal h1, .reveal h2, .reveal h3, .reveal h4, .reveal h5, .reveal h6 { margin: 0 0 20px 0; - color: #383d3d; - font-family: "Palatino Linotype", "Book Antiqua", Palatino, FreeSerif, serif; - line-height: 1em; - letter-spacing: 0.02em; + color: #383D3D; + font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, FreeSerif, serif; + line-height: 1.2; + letter-spacing: normal; text-transform: none; text-shadow: none; word-wrap: break-word; } @@ -62,32 +55,27 @@ body { font-size: 1em; } .reveal h1 { - text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.2); } + text-shadow: none; } /********************************************* * OTHER *********************************************/ .reveal p { margin-bottom: 10px; - line-height: 1.2em; } + line-height: 1.3; } /* Ensure certain elements are never larger than the slide itself */ -.reveal img, -.reveal video, -.reveal iframe { +.reveal img, .reveal video, .reveal iframe { max-width: 95%; max-height: 95%; } -.reveal strong, -.reveal b { +.reveal strong, .reveal b { font-weight: bold; } .reveal em { font-style: italic; } -.reveal ol, -.reveal dl, -.reveal ul { +.reveal ol, .reveal dl, .reveal ul { display: inline-block; text-align: left; margin: 0 0 0 1em; } @@ -104,10 +92,7 @@ body { .reveal ul ul ul { list-style-type: circle; } -.reveal ul ul, -.reveal ul ol, -.reveal ol ol, -.reveal ol ul { +.reveal ul ul, .reveal ul ol, .reveal ol ol, .reveal ol ul { display: block; margin-left: 40px; } @@ -117,8 +102,7 @@ body { .reveal dd { margin-left: 40px; } -.reveal q, -.reveal blockquote { +.reveal q, .reveal blockquote { quotes: none; } .reveal blockquote { @@ -131,8 +115,7 @@ body { 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 { +.reveal blockquote p:first-child, .reveal blockquote p:last-child { display: inline-block; } .reveal q { @@ -170,8 +153,7 @@ body { .reveal table th { font-weight: bold; } -.reveal table th, -.reveal table td { +.reveal table th, .reveal table td { text-align: left; padding: 0.2em 0.5em 0.2em 0.5em; border-bottom: 1px solid; } @@ -198,14 +180,14 @@ body { * LINKS *********************************************/ .reveal a { - color: #51483d; + color: #51483D; text-decoration: none; - -webkit-transition: color .15s ease; - -moz-transition: color .15s ease; - transition: color .15s ease; } + -webkit-transition: color 0.15s ease; + -moz-transition: color 0.15s ease; + transition: color 0.15s ease; } .reveal a:hover { - color: #8b7c69; + color: #8b7b69; text-shadow: none; border: none; } @@ -219,49 +201,45 @@ body { .reveal section img { margin: 15px 0px; background: rgba(255, 255, 255, 0.12); - border: 4px solid black; + border: 4px solid #000; box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); } .reveal a img { - -webkit-transition: all .15s linear; - -moz-transition: all .15s linear; - transition: all .15s linear; } + -webkit-transition: all 0.15s linear; + -moz-transition: all 0.15s linear; + transition: all 0.15s linear; } .reveal a:hover img { background: rgba(255, 255, 255, 0.2); - border-color: #51483d; + border-color: #51483D; box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); } /********************************************* * NAVIGATION CONTROLS *********************************************/ -.reveal .controls div.navigate-left, -.reveal .controls div.navigate-left.enabled { - border-right-color: #51483d; } +.reveal .controls div.navigate-left, .reveal .controls div.navigate-left.enabled { + border-right-color: #51483D; } -.reveal .controls div.navigate-right, -.reveal .controls div.navigate-right.enabled { - border-left-color: #51483d; } +.reveal .controls div.navigate-right, .reveal .controls div.navigate-right.enabled { + border-left-color: #51483D; } -.reveal .controls div.navigate-up, -.reveal .controls div.navigate-up.enabled { - border-bottom-color: #51483d; } +.reveal .controls div.navigate-up, .reveal .controls div.navigate-up.enabled { + border-bottom-color: #51483D; } -.reveal .controls div.navigate-down, -.reveal .controls div.navigate-down.enabled { - border-top-color: #51483d; } +.reveal .controls div.navigate-down, .reveal .controls div.navigate-down.enabled { + border-top-color: #51483D; } .reveal .controls div.navigate-left.enabled:hover { - border-right-color: #8b7c69; } + border-right-color: #8b7b69; } .reveal .controls div.navigate-right.enabled:hover { - border-left-color: #8b7c69; } + border-left-color: #8b7b69; } .reveal .controls div.navigate-up.enabled:hover { - border-bottom-color: #8b7c69; } + border-bottom-color: #8b7b69; } .reveal .controls div.navigate-down.enabled:hover { - border-top-color: #8b7c69; } + border-top-color: #8b7b69; } /********************************************* * PROGRESS BAR @@ -270,7 +248,7 @@ body { background: rgba(0, 0, 0, 0.2); } .reveal .progress span { - background: #51483d; + background: #51483D; -webkit-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); -moz-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); } @@ -279,4 +257,4 @@ body { * SLIDE NUMBER *********************************************/ .reveal .slide-number { - color: #51483d; } + color: #51483D; } diff --git a/css/theme/simple.css b/css/theme/simple.css index 528bac8..6d65454 100644 --- a/css/theme/simple.css +++ b/css/theme/simple.css @@ -1,3 +1,5 @@ +@import url(https://fonts.googleapis.com/css?family=News+Cycle:400,700); +@import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic); /** * A simple theme for reveal.js presentations, similar * to the default theme. The accent color is darkblue. @@ -5,46 +7,37 @@ * This theme is Copyright (C) 2012 Owen Versteeg, https://github.com/StereotypicalApps. It is MIT licensed. * reveal.js is Copyright (C) 2011-2012 Hakim El Hattab, http://hakim.se */ -@import url(https://fonts.googleapis.com/css?family=News+Cycle:400,700); -@import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic); /********************************************* * GLOBAL STYLES *********************************************/ body { - background: white; - background-color: white; } + background: #fff; + background-color: #fff; } .reveal { - font-family: "Lato", sans-serif; + font-family: 'Lato', sans-serif; font-size: 36px; font-weight: normal; - letter-spacing: -0.02em; - color: black; } + color: #000; } ::selection { - color: white; + color: #fff; background: rgba(0, 0, 0, 0.99); text-shadow: none; } -.reveal .slides > section, -.reveal .slides > section > section { - line-height: 1.2em; +.reveal .slides > section, .reveal .slides > section > section { + line-height: 1.3; font-weight: inherit; } /********************************************* * HEADERS *********************************************/ -.reveal h1, -.reveal h2, -.reveal h3, -.reveal h4, -.reveal h5, -.reveal h6 { +.reveal h1, .reveal h2, .reveal h3, .reveal h4, .reveal h5, .reveal h6 { margin: 0 0 20px 0; - color: black; - font-family: "News Cycle", Impact, sans-serif; - line-height: 1em; - letter-spacing: 0.02em; + color: #000; + font-family: 'News Cycle', Impact, sans-serif; + line-height: 1.2; + letter-spacing: normal; text-transform: none; text-shadow: none; word-wrap: break-word; } @@ -62,32 +55,27 @@ body { font-size: 1em; } .reveal h1 { - text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.2); } + text-shadow: none; } /********************************************* * OTHER *********************************************/ .reveal p { margin-bottom: 10px; - line-height: 1.2em; } + line-height: 1.3; } /* Ensure certain elements are never larger than the slide itself */ -.reveal img, -.reveal video, -.reveal iframe { +.reveal img, .reveal video, .reveal iframe { max-width: 95%; max-height: 95%; } -.reveal strong, -.reveal b { +.reveal strong, .reveal b { font-weight: bold; } .reveal em { font-style: italic; } -.reveal ol, -.reveal dl, -.reveal ul { +.reveal ol, .reveal dl, .reveal ul { display: inline-block; text-align: left; margin: 0 0 0 1em; } @@ -104,10 +92,7 @@ body { .reveal ul ul ul { list-style-type: circle; } -.reveal ul ul, -.reveal ul ol, -.reveal ol ol, -.reveal ol ul { +.reveal ul ul, .reveal ul ol, .reveal ol ol, .reveal ol ul { display: block; margin-left: 40px; } @@ -117,8 +102,7 @@ body { .reveal dd { margin-left: 40px; } -.reveal q, -.reveal blockquote { +.reveal q, .reveal blockquote { quotes: none; } .reveal blockquote { @@ -131,8 +115,7 @@ body { 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 { +.reveal blockquote p:first-child, .reveal blockquote p:last-child { display: inline-block; } .reveal q { @@ -170,8 +153,7 @@ body { .reveal table th { font-weight: bold; } -.reveal table th, -.reveal table td { +.reveal table th, .reveal table td { text-align: left; padding: 0.2em 0.5em 0.2em 0.5em; border-bottom: 1px solid; } @@ -198,11 +180,11 @@ body { * LINKS *********************************************/ .reveal a { - color: darkblue; + color: #00008B; text-decoration: none; - -webkit-transition: color .15s ease; - -moz-transition: color .15s ease; - transition: color .15s ease; } + -webkit-transition: color 0.15s ease; + -moz-transition: color 0.15s ease; + transition: color 0.15s ease; } .reveal a:hover { color: #0000f1; @@ -219,37 +201,33 @@ body { .reveal section img { margin: 15px 0px; background: rgba(255, 255, 255, 0.12); - border: 4px solid black; + border: 4px solid #000; box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); } .reveal a img { - -webkit-transition: all .15s linear; - -moz-transition: all .15s linear; - transition: all .15s linear; } + -webkit-transition: all 0.15s linear; + -moz-transition: all 0.15s linear; + transition: all 0.15s linear; } .reveal a:hover img { background: rgba(255, 255, 255, 0.2); - border-color: darkblue; + border-color: #00008B; box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); } /********************************************* * NAVIGATION CONTROLS *********************************************/ -.reveal .controls div.navigate-left, -.reveal .controls div.navigate-left.enabled { - border-right-color: darkblue; } +.reveal .controls div.navigate-left, .reveal .controls div.navigate-left.enabled { + border-right-color: #00008B; } -.reveal .controls div.navigate-right, -.reveal .controls div.navigate-right.enabled { - border-left-color: darkblue; } +.reveal .controls div.navigate-right, .reveal .controls div.navigate-right.enabled { + border-left-color: #00008B; } -.reveal .controls div.navigate-up, -.reveal .controls div.navigate-up.enabled { - border-bottom-color: darkblue; } +.reveal .controls div.navigate-up, .reveal .controls div.navigate-up.enabled { + border-bottom-color: #00008B; } -.reveal .controls div.navigate-down, -.reveal .controls div.navigate-down.enabled { - border-top-color: darkblue; } +.reveal .controls div.navigate-down, .reveal .controls div.navigate-down.enabled { + border-top-color: #00008B; } .reveal .controls div.navigate-left.enabled:hover { border-right-color: #0000f1; } @@ -270,7 +248,7 @@ body { background: rgba(0, 0, 0, 0.2); } .reveal .progress span { - background: darkblue; + background: #00008B; -webkit-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); -moz-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); } @@ -279,4 +257,4 @@ body { * SLIDE NUMBER *********************************************/ .reveal .slide-number { - color: darkblue; } + color: #00008B; } diff --git a/css/theme/sky.css b/css/theme/sky.css index 0601db4..36d0b02 100644 --- a/css/theme/sky.css +++ b/css/theme/sky.css @@ -1,10 +1,10 @@ +@import url(https://fonts.googleapis.com/css?family=Quicksand:400,700,400italic,700italic); +@import url(https://fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,400,700); /** * Sky theme for reveal.js. * * Copyright (C) 2011-2012 Hakim El Hattab, http://hakim.se */ -@import url(https://fonts.googleapis.com/css?family=Quicksand:400,700,400italic,700italic); -@import url(https://fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,400,700); .reveal a { line-height: 1.3em; } @@ -22,35 +22,28 @@ body { background-color: #f7fbfc; } .reveal { - font-family: "Open Sans", sans-serif; + font-family: 'Open Sans', sans-serif; font-size: 36px; font-weight: normal; - letter-spacing: -0.02em; - color: #333333; } + color: #333; } ::selection { - color: white; + color: #fff; background: #134674; text-shadow: none; } -.reveal .slides > section, -.reveal .slides > section > section { - line-height: 1.2em; +.reveal .slides > section, .reveal .slides > section > section { + line-height: 1.3; font-weight: inherit; } /********************************************* * HEADERS *********************************************/ -.reveal h1, -.reveal h2, -.reveal h3, -.reveal h4, -.reveal h5, -.reveal h6 { +.reveal h1, .reveal h2, .reveal h3, .reveal h4, .reveal h5, .reveal h6 { margin: 0 0 20px 0; - color: #333333; - font-family: "Quicksand", sans-serif; - line-height: 1em; + color: #333; + font-family: 'Quicksand', sans-serif; + line-height: 1.2; letter-spacing: -0.08em; text-transform: uppercase; text-shadow: none; @@ -69,32 +62,27 @@ body { font-size: 1em; } .reveal h1 { - text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.2); } + text-shadow: none; } /********************************************* * OTHER *********************************************/ .reveal p { margin-bottom: 10px; - line-height: 1.2em; } + line-height: 1.3; } /* Ensure certain elements are never larger than the slide itself */ -.reveal img, -.reveal video, -.reveal iframe { +.reveal img, .reveal video, .reveal iframe { max-width: 95%; max-height: 95%; } -.reveal strong, -.reveal b { +.reveal strong, .reveal b { font-weight: bold; } .reveal em { font-style: italic; } -.reveal ol, -.reveal dl, -.reveal ul { +.reveal ol, .reveal dl, .reveal ul { display: inline-block; text-align: left; margin: 0 0 0 1em; } @@ -111,10 +99,7 @@ body { .reveal ul ul ul { list-style-type: circle; } -.reveal ul ul, -.reveal ul ol, -.reveal ol ol, -.reveal ol ul { +.reveal ul ul, .reveal ul ol, .reveal ol ol, .reveal ol ul { display: block; margin-left: 40px; } @@ -124,8 +109,7 @@ body { .reveal dd { margin-left: 40px; } -.reveal q, -.reveal blockquote { +.reveal q, .reveal blockquote { quotes: none; } .reveal blockquote { @@ -138,8 +122,7 @@ body { 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 { +.reveal blockquote p:first-child, .reveal blockquote p:last-child { display: inline-block; } .reveal q { @@ -177,8 +160,7 @@ body { .reveal table th { font-weight: bold; } -.reveal table th, -.reveal table td { +.reveal table th, .reveal table td { text-align: left; padding: 0.2em 0.5em 0.2em 0.5em; border-bottom: 1px solid; } @@ -207,18 +189,18 @@ body { .reveal a { color: #3b759e; text-decoration: none; - -webkit-transition: color .15s ease; - -moz-transition: color .15s ease; - transition: color .15s ease; } + -webkit-transition: color 0.15s ease; + -moz-transition: color 0.15s ease; + transition: color 0.15s ease; } .reveal a:hover { - color: #74a7cb; + color: #74a8cb; text-shadow: none; border: none; } .reveal .roll span:after { color: #fff; - background: #264c66; } + background: #264d66; } /********************************************* * IMAGES @@ -226,13 +208,13 @@ body { .reveal section img { margin: 15px 0px; background: rgba(255, 255, 255, 0.12); - border: 4px solid #333333; + border: 4px solid #333; box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); } .reveal a img { - -webkit-transition: all .15s linear; - -moz-transition: all .15s linear; - transition: all .15s linear; } + -webkit-transition: all 0.15s linear; + -moz-transition: all 0.15s linear; + transition: all 0.15s linear; } .reveal a:hover img { background: rgba(255, 255, 255, 0.2); @@ -242,33 +224,29 @@ body { /********************************************* * NAVIGATION CONTROLS *********************************************/ -.reveal .controls div.navigate-left, -.reveal .controls div.navigate-left.enabled { +.reveal .controls div.navigate-left, .reveal .controls div.navigate-left.enabled { border-right-color: #3b759e; } -.reveal .controls div.navigate-right, -.reveal .controls div.navigate-right.enabled { +.reveal .controls div.navigate-right, .reveal .controls div.navigate-right.enabled { border-left-color: #3b759e; } -.reveal .controls div.navigate-up, -.reveal .controls div.navigate-up.enabled { +.reveal .controls div.navigate-up, .reveal .controls div.navigate-up.enabled { border-bottom-color: #3b759e; } -.reveal .controls div.navigate-down, -.reveal .controls div.navigate-down.enabled { +.reveal .controls div.navigate-down, .reveal .controls div.navigate-down.enabled { border-top-color: #3b759e; } .reveal .controls div.navigate-left.enabled:hover { - border-right-color: #74a7cb; } + border-right-color: #74a8cb; } .reveal .controls div.navigate-right.enabled:hover { - border-left-color: #74a7cb; } + border-left-color: #74a8cb; } .reveal .controls div.navigate-up.enabled:hover { - border-bottom-color: #74a7cb; } + border-bottom-color: #74a8cb; } .reveal .controls div.navigate-down.enabled:hover { - border-top-color: #74a7cb; } + border-top-color: #74a8cb; } /********************************************* * PROGRESS BAR diff --git a/css/theme/solarized.css b/css/theme/solarized.css index 866c314..dd4ec2b 100644 --- a/css/theme/solarized.css +++ b/css/theme/solarized.css @@ -1,14 +1,15 @@ +@import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic); /** * Solarized Light theme for reveal.js. * Author: Achim Staebler */ -@import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic); @font-face { font-family: 'League Gothic'; - src: url("../../lib/font/league_gothic-webfont.eot"); - src: url("../../lib/font/league_gothic-webfont.eot?#iefix") format("embedded-opentype"), url("../../lib/font/league_gothic-webfont.woff") format("woff"), url("../../lib/font/league_gothic-webfont.ttf") format("truetype"), url("../../lib/font/league_gothic-webfont.svg#LeagueGothicRegular") format("svg"); + src: url('../../lib/font/league_gothic-webfont.eot'); + src: url('../../lib/font/league_gothic-webfont.eot?#iefix') format('embedded-opentype'), url('../../lib/font/league_gothic-webfont.woff') format('woff'), url('../../lib/font/league_gothic-webfont.ttf') format('truetype'), url('../../lib/font/league_gothic-webfont.svg#LeagueGothicRegular') format('svg'); font-weight: normal; font-style: normal; } + /** * Solarized colors by Ethan Schoonover */ @@ -24,36 +25,29 @@ body { background-color: #fdf6e3; } .reveal { - font-family: "Lato", sans-serif; + font-family: 'Lato', sans-serif; font-size: 36px; font-weight: normal; - letter-spacing: -0.02em; color: #657b83; } ::selection { - color: white; + color: #fff; background: #d33682; text-shadow: none; } -.reveal .slides > section, -.reveal .slides > section > section { - line-height: 1.2em; +.reveal .slides > section, .reveal .slides > section > section { + line-height: 1.3; font-weight: inherit; } /********************************************* * HEADERS *********************************************/ -.reveal h1, -.reveal h2, -.reveal h3, -.reveal h4, -.reveal h5, -.reveal h6 { +.reveal h1, .reveal h2, .reveal h3, .reveal h4, .reveal h5, .reveal h6 { margin: 0 0 20px 0; color: #586e75; - font-family: "League Gothic", Impact, sans-serif; - line-height: 1em; - letter-spacing: 0.02em; + font-family: 'League Gothic', Impact, sans-serif; + line-height: 1.2; + letter-spacing: normal; text-transform: uppercase; text-shadow: none; word-wrap: break-word; } @@ -71,32 +65,27 @@ body { font-size: 1em; } .reveal h1 { - text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.2); } + text-shadow: none; } /********************************************* * OTHER *********************************************/ .reveal p { margin-bottom: 10px; - line-height: 1.2em; } + line-height: 1.3; } /* Ensure certain elements are never larger than the slide itself */ -.reveal img, -.reveal video, -.reveal iframe { +.reveal img, .reveal video, .reveal iframe { max-width: 95%; max-height: 95%; } -.reveal strong, -.reveal b { +.reveal strong, .reveal b { font-weight: bold; } .reveal em { font-style: italic; } -.reveal ol, -.reveal dl, -.reveal ul { +.reveal ol, .reveal dl, .reveal ul { display: inline-block; text-align: left; margin: 0 0 0 1em; } @@ -113,10 +102,7 @@ body { .reveal ul ul ul { list-style-type: circle; } -.reveal ul ul, -.reveal ul ol, -.reveal ol ol, -.reveal ol ul { +.reveal ul ul, .reveal ul ol, .reveal ol ol, .reveal ol ul { display: block; margin-left: 40px; } @@ -126,8 +112,7 @@ body { .reveal dd { margin-left: 40px; } -.reveal q, -.reveal blockquote { +.reveal q, .reveal blockquote { quotes: none; } .reveal blockquote { @@ -140,8 +125,7 @@ body { 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 { +.reveal blockquote p:first-child, .reveal blockquote p:last-child { display: inline-block; } .reveal q { @@ -179,8 +163,7 @@ body { .reveal table th { font-weight: bold; } -.reveal table th, -.reveal table td { +.reveal table th, .reveal table td { text-align: left; padding: 0.2em 0.5em 0.2em 0.5em; border-bottom: 1px solid; } @@ -209,18 +192,18 @@ body { .reveal a { color: #268bd2; text-decoration: none; - -webkit-transition: color .15s ease; - -moz-transition: color .15s ease; - transition: color .15s ease; } + -webkit-transition: color 0.15s ease; + -moz-transition: color 0.15s ease; + transition: color 0.15s ease; } .reveal a:hover { - color: #78b9e6; + color: #78bae6; text-shadow: none; border: none; } .reveal .roll span:after { color: #fff; - background: #1a6091; } + background: #1a6291; } /********************************************* * IMAGES @@ -232,9 +215,9 @@ body { box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); } .reveal a img { - -webkit-transition: all .15s linear; - -moz-transition: all .15s linear; - transition: all .15s linear; } + -webkit-transition: all 0.15s linear; + -moz-transition: all 0.15s linear; + transition: all 0.15s linear; } .reveal a:hover img { background: rgba(255, 255, 255, 0.2); @@ -244,33 +227,29 @@ body { /********************************************* * NAVIGATION CONTROLS *********************************************/ -.reveal .controls div.navigate-left, -.reveal .controls div.navigate-left.enabled { +.reveal .controls div.navigate-left, .reveal .controls div.navigate-left.enabled { border-right-color: #268bd2; } -.reveal .controls div.navigate-right, -.reveal .controls div.navigate-right.enabled { +.reveal .controls div.navigate-right, .reveal .controls div.navigate-right.enabled { border-left-color: #268bd2; } -.reveal .controls div.navigate-up, -.reveal .controls div.navigate-up.enabled { +.reveal .controls div.navigate-up, .reveal .controls div.navigate-up.enabled { border-bottom-color: #268bd2; } -.reveal .controls div.navigate-down, -.reveal .controls div.navigate-down.enabled { +.reveal .controls div.navigate-down, .reveal .controls div.navigate-down.enabled { border-top-color: #268bd2; } .reveal .controls div.navigate-left.enabled:hover { - border-right-color: #78b9e6; } + border-right-color: #78bae6; } .reveal .controls div.navigate-right.enabled:hover { - border-left-color: #78b9e6; } + border-left-color: #78bae6; } .reveal .controls div.navigate-up.enabled:hover { - border-bottom-color: #78b9e6; } + border-bottom-color: #78bae6; } .reveal .controls div.navigate-down.enabled:hover { - border-top-color: #78b9e6; } + border-top-color: #78bae6; } /********************************************* * PROGRESS BAR diff --git a/css/theme/source/black.scss b/css/theme/source/black.scss new file mode 100644 index 0000000..6c1e271 --- /dev/null +++ b/css/theme/source/black.scss @@ -0,0 +1,44 @@ +/** + * Black theme for reveal.js. + * + * Copyright (C) 2014 Hakim El Hattab, http://hakim.se + */ + + +// Default mixins and settings ----------------- +@import "../template/mixins"; +@import "../template/settings"; +// --------------------------------------------- + + +// Include theme-specific fonts +@import url(https://fonts.googleapis.com/css?family=Montserrat:400); +@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700,400italic,700italic); + + +// Override theme settings (see ../template/settings.scss) +$backgroundColor: #111; + +$mainColor: #fff; +$headingColor: #fff; + +$mainFont: 'Open Sans', Helvetica, sans-serif; +$mainFontSize: 34px; +$headingFont: 'Montserrat', Helvetica, sans-serif; +$headingTextShadow: none; +$headingLetterSpacing: normal; +$headingTextTransform: uppercase; +$linkColor: #3992fb; +$linkColorHover: lighten( $linkColor, 15% ); +$selectionBackgroundColor: lighten( $linkColor, 25% ); + +$heading1Size: 2.8em; +$heading2Size: 1.8em; +$heading3Size: 1.5em; +$heading4Size: 1.0em; + + + +// Theme template ------------------------------ +@import "../template/theme"; +// ---------------------------------------------
\ No newline at end of file diff --git a/css/theme/source/default.scss b/css/theme/source/default.scss index 1117b65..9c40485 100644 --- a/css/theme/source/default.scss +++ b/css/theme/source/default.scss @@ -28,6 +28,7 @@ @import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic); // Override theme settings (see ../template/settings.scss) +$headingTextShadow: 0px 0px 6px rgba(0,0,0,0.2); $heading1TextShadow: 0 1px 0 #ccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaa, 0 6px 1px rgba(0,0,0,.1), 0 0 5px rgba(0,0,0,.1), 0 1px 3px rgba(0,0,0,.3), 0 3px 5px rgba(0,0,0,.2), 0 5px 10px rgba(0,0,0,.25), 0 20px 20px rgba(0,0,0,.15); // Background generator diff --git a/css/theme/template/settings.scss b/css/theme/template/settings.scss index 1b4fe9b..88f7d75 100644 --- a/css/theme/template/settings.scss +++ b/css/theme/template/settings.scss @@ -13,12 +13,17 @@ $mainColor: #eee; $headingMargin: 0 0 20px 0; $headingFont: 'League Gothic', Impact, sans-serif; $headingColor: #eee; -$headingLineHeight: 1em; -$headingLetterSpacing: 0.02em; +$headingLineHeight: 1.2; +$headingLetterSpacing: normal; $headingTextTransform: uppercase; -$headingTextShadow: 0px 0px 6px rgba(0,0,0,0.2); +$headingTextShadow: none; $heading1TextShadow: $headingTextShadow; +$heading1Size: 3.77em; +$heading2Size: 2.11em; +$heading3Size: 1.55em; +$heading4Size: 1.00em; + // Links and actions $linkColor: #13DAEC; $linkColorHover: lighten( $linkColor, 20% ); diff --git a/css/theme/template/theme.scss b/css/theme/template/theme.scss index 17cf688..f2a542e 100644 --- a/css/theme/template/theme.scss +++ b/css/theme/template/theme.scss @@ -13,7 +13,6 @@ body { font-family: $mainFont; font-size: $mainFontSize; font-weight: normal; - letter-spacing: -0.02em; color: $mainColor; } @@ -25,7 +24,7 @@ body { .reveal .slides>section, .reveal .slides>section>section { - line-height: 1.2em; + line-height: 1.3; font-weight: inherit; } @@ -52,10 +51,10 @@ body { 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; } +.reveal h1 {font-size: $heading1Size; } +.reveal h2 {font-size: $heading2Size; } +.reveal h3 {font-size: $heading3Size; } +.reveal h4 {font-size: $heading4Size; } .reveal h1 { text-shadow: $heading1TextShadow; @@ -68,7 +67,7 @@ body { .reveal p { margin-bottom: 10px; - line-height: 1.2em; + line-height: 1.3; } /* Ensure certain elements are never larger than the slide itself */ |