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 {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    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 {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}


body {
    font-family: 'Cantora One', sans-serif;

    min-height: 740px;

    -webkit-font-smoothing: antialiased;
}

b, strong { font-weight: bold }
i, em { font-style: italic}

/* enable clicking on elements 'hiding' behind body in 3D */
/* body     { pointer-events: none; } */
#impress { pointer-events: auto; }
/* COMMON STEP STYLES */

body,html { height: 100%; font-family: 'Trebuchet MS', Helvetica, sans-serif; }
#mapBox, #impressWrap { position: absolute; left: 248px; right: 0; height: 100%; }
#sidebar { position: absolute; left: 0; width: 246px; height: 100%; background-color: #cecece; 
    border-right: 2px solid #959595; padding: 15px 0 0 5px; z-index: 99999 !important; }
.leaflet-tile-pane { opacity: 0.4; }

#sidebar .links a,
#aboutApp a {
    cursor: pointer;
    color: black;
    display: block;
    font-size: 14px;
    margin: 6px 0;
    text-decoration: none;
}

#sidebar .links a:hover { color: gray; }
#sidebar .links a.active { color: gray; }
#sidebar .title { font-weight: bold; margin-bottom: 10px; margin-left: 10px; }
#aboutApp { position: absolute; bottom: 15px; left: 0; right: 0; padding: 0 0 5px 10px; background-color: #E4E4E4; border-top: 1px solid black; }
#aboutApp a { display: inline-block; }

.step { width: 1000px; font-size: 48px; line-height: 1.5;
-webkit-box-sizing: border-box;
-moz-box-sizing:    border-box;
-ms-box-sizing:     border-box;
-o-box-sizing:      border-box;
box-sizing:         border-box;
}
.step { -webkit-transition: opacity 1s; -moz-transition: opacity 1s; -ms-transition: opacity 1s; -o-transition: opacity 1s; transition: opacity 1s; }
/* fade out inactive slides */
.step:not(.active) { opacity: 0; }
.step .title { font-weight: bold; margin: 5px 0; }
.step .autor { font-size: 16px; font-style: italic; margin: 5px 0; }


#title { text-align: center; }
#title h2 { font-size: 35px; margin-bottom: 30px; }
#title h3 { font-size: 25px; margin-bottom: 20px; }
#title { background-color: rgba(177,177,177,0.5); border-radius: 15px; }

.content { font-size: 20px; width: 400px; background-color: rgba(177,177,177,0.5); border-radius: 15px; padding: 10px; margin: 0 auto; opacity: 1; }
.step.present.active .content { 
    opacity: 0;
    -webkit-transition-delay: 5s !important;
    -moz-transition-delay:    5s !important;
    -ms-transition-delay:     5s !important;
    -o-transition-delay:      5s !important;
    transition-delay:         5s !important;

    -webkit-transition: opacity 1s;
    -moz-transition:    opacity 1s;
    -ms-transition:     opacity 1s;
    -o-transition:      opacity 1s;
    transition:         opacity 1s;
 }

.endSlide { width: 400px; }
.endSlide .title { font-size: 25px; }
.endSlide li { margin: 0 15px; }
.endSlide a { text-decoration: none; color: #fff; text-shadow: 1px 1px 1px #000; }

#help { font-size: 13px; line-height: 20px; position: absolute; bottom: 55px; }
#help pre { display: inline; }
#help h2 { font-weight: bold; cursor: pointer; }
#help div { display: none; }


/* IMPRESS NOT SUPPORTED STYLES */

.fallback-message { font-family: sans-serif; line-height: 1.3; display: none; width: 780px; padding: 10px 10px 0; margin: 20px auto; border-radius: 10px; border: 1px solid #E4C652; background: #EEDC94; }
.fallback-message p { margin-bottom: 10px; }
.impress-disabled .step,
.impress-not-supported .step { position: relative; opacity: 1; margin: 20px auto; }
.impress-not-supported .fallback-message { display: block; }