$transition-duration: 1000ms !default;
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
border: 0;
font: inherit;
font-size: 100%;
margin: 0;
padding: 0;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
display: block;
}
body {
line-height: 1;
}
ol,
ul {
line-height: 150%;
}
blockquote,
q {
quotes: none;
}
blockquote::before,
blockquote::after,
q::before,
q::after {
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
/* Defaults */
body {
background-color: #e0e0e0;
font-family: 'PT Sans', sans-serif;
min-height: 740px;
}
b,
strong {
font-weight: bold;
}
i,
em {
font-style: italic;
}
a {
border-radius: 4px;
color: rgba(0, 0, 0, 0.87);
margin: 0 -8px;
padding: 0 8px;
transition: 0.5s;
}
a:hover,
a:focus {
background: #ddd;
box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
color: #000;
}
h1,
h2,
h3 {
font-size: 300%;
line-height: 120%;
}
/* Fallback message */
.fallback-message {
background: #eedc94;
border: 1px solid #e4c652;
border-radius: 10px;
font-family: sans-serif;
line-height: 1.3;
margin: 20px auto;
padding: 10px 10px 0;
width: 780px;
}
.fallback-message p {
margin-bottom: 10px;
}
.impress-supported .fallback-message {
display: none;
}
/****************
* Presentation *
****************/
/* Steps */
.step {
box-sizing: border-box;
font-family: 'PT Sans', sans-serif;
font-size: 48px;
line-height: 1.5;
margin: 20px auto;
padding: 40px;
position: relative;
width: 1920px;
}
.impress-enabled .step {
margin: 0;
opacity: 1;
transition: opacity $transition-duration;
}
.impress-enabled .step.active {
opacity: 1;
}
/* DEBUGGING *
.slide.present {
background-color: rgba(255, 255, 255, 0.1);
}
/**/
/* HIERARCHY */
.step.depth-2,
.step.depth-3 {
cursor: pointer;
}
.step.present {
cursor: initial;
}
/*
We also make other steps visible and give them a pointer cursor using the
`impress-on-` class.
*/
.impress-on-overview .step {
cursor: pointer;
opacity: 1;
}
/*
In fact, we can hide the mouse cursor itself too, when mouse isn't used.
*/
.impress-mouse-timeout {
cursor: none;
}
/*
And as the last thing there is a workaround for quite strange bug.
It happens a lot in Chrome. I don't remember if I've seen it in Firefox.
Sometimes the element positioned in 3D (especially when it's moved back
along Z axis) is not clickable, because it falls 'behind' the
element.
To prevent this, I decided to make non clickable by setting
pointer-events property to `none` value.
Value if this property is inherited, so to make everything else clickable
I bring it back on the #impress element.
If you want to know more about `pointer-events` here are some docs:
https://developer.mozilla.org/en/CSS/pointer-events
There is one very important thing to notice about this workaround - it makes
everything 'unclickable' except what's in #impress element.
So use it wisely ... or don't use at all.
*/
.impress-enabled {
pointer-events: none;
}
.impress-enabled #impress {
pointer-events: auto;
}
/*
* PLUGINS
*/
/*
This version of impress.js supports plugins, and in particular, a UI toolbar
plugin that allows easy navigation between steps and autoplay.
*/
.impress-enabled #impress-console-button {
pointer-events: auto;
}
/* notes */
.slide.present .notes {
opacity: 0;
}
@import 'impress.hint';
@import 'impress.help';
@import 'impress.toolbar';
@import 'impress.progress';
@import 'impress.slide';
@import 'impress.layout';
@import 'impress.print';
@import 'shape.circle';
@import 'shape.square';
@import 'shape.rounded';
@import 'shape.none';
@import 'theme.newspaper';
@import 'theme.gallery';
@import 'theme.planet';
@import 'theme.slides';
@import 'colors';