modified pandoc dzslides CSS, forked from https://github.com/aski/html5-slides

slides.css

@font-face {
	font-family: 'PT Mono';
    font-style: normal;
	font-weight: normal;
	src: local("☺"), url('fonts/PT_Mono-Regular.ttf') format('truetype');
}
@font-face {
	font-family: 'PT Sans';
    font-style: normal; 
	font-weight: bold;
	src: local("☺"), url('fonts/PT_Sans-Web-Bold.ttf') format('truetype');
}@font-face {
	font-family: 'PT Sans';
    font-style: italic;
	font-weight: normal;
	src: local("☺"), url('fonts/PT_Sans-Web-Italic.ttf') format('truetype');
}@font-face {
	font-family: 'PT Sans';
    font-style: normal;
	font-weight: normal;
	src: local("☺"), url('fonts/PT_Sans-Web-Regular.ttf') format('truetype');
}
@font-face {
	font-family: 'PT Sans Narrow';
    font-style: normal;
	font-weight: bold;
	src: local("☺"), url('fonts/PT_Sans-Narrow-Web-Bold.ttf') format('truetype');
}
@font-face {
	font-family: 'PT Sans Narrow';
    font-style: normal;
	font-weight: normal;
	src: local("☺"), url('fonts/PT_Sans-Narrow-Web-Regular.ttf') format('truetype');
}
html {
    height: 100%;
	background-color: #fefffe;
}
body {
	width: 1024px !important;
    height: 600px !important;
	margin-left: -450px !important;
	margin-top: -300px !important;
}
section {
	background: transparent;
	color: #000;
	width: 800px !important;
	height: 600px !important;
    padding: 50px 112px 0;	
	font-family: 'PT Sans', sans-serif;
	font-size: 13pt;
}
body :first-child {
}
address, blockquote, dl, fieldset, form, h1, h2, h3, h4, h5, h6, hr, ol, p, pre, table, ul, dl { padding: 5px 10px 5px 10px; }
h1, h2, h3 {
	text-align: left;
	color: #666; 
	font-family: 'PT Sans Narrow', sans-serif;
	font-weight: bold;
}
input, select {
border 0.5pt solid black;
font-size: 13pt;
line-height: 7pt;
padding: 0 0 -2.5pt 0;
z-index:1;
}
ul, ol {
	margin: 5px 5px 5px 20px;
}
a {
    color: #268BD2;
    -webkit-transition: background-color .2s;
    -moz-transition: background-color .2s;
    -ms-transition: background-color .2s;
    -o-transition: background-color .2s;
    transition: background-color .2s; 
    text-decoration:none;
}

a:hover {
    background-color: #EEE8D5;
    text-decoration:underline;
}

section.titleslide h1 { margin-top: 100px; }
h1.title { margin-top: 100px; font-size:120%; margin-bottom: 10px; text-align: center; text-shadow:0px 1px 1px #444; 
-webkit-transition: color 1s ease-in-out;
-moz-transition: color 1s ease-in-out;
 }
h1.title:hover {
color: #C43628;
}
h2.author { font-size: 100%; margin-top: 0px; margin-bottom: 0px; text-align:center; color: #555; font-family: 'PT Sans Narrow'; font-weight: normal;}
h3.date { font-size: 80%; margin-top: 0px; text-align: center; color: #555; font-family: 'PT Mono'; font-weight: normal;}
h1 { font-size: 150%; margin: 0 0 5px; text-shadow:0px 2px 1px #fff;}
h2 { font-size: 120%; } 
h3 { font-size: 100%; }
blockquote { font-style: italic }
q { quotes: "“" "”" "‘" "’"; }
footer {
	position: absolute;
	bottom: 10px;
	right: 20px;
	text-shadow: white 0px 1px 0px, rgba(0, 0, 0, 0.2) 0 2px 5px;
}
pre {
    border-style: dotted;
    border-width: 1px;
    border-color: #666;
    border-radius: 5px;
    background-color: #fff;
    font-size: 13px;
}

pre.haskell {
    border-style: none;
    background-color: #eee;
}

code {
    color: #33f;
}

pre code {
    color: #000;
}

pre.haskell code {
    background-color: #eee;
}

pre, code { background: transparent; }
pre { padding: 5px 20px; }
td > pre { padding: 0px; }
td { padding: 2px; }
::-moz-selection { background-color: khaki; }
code { font-family: 'PT Mono'; font-size: 90%; }
code > span.co { font-style: normal; }
code > span.kw { font-weight: normal; }
code > span.er { font-weight: normal; }

/* Transition effect */
/* Feel free to change the transition effect for original
animations. See here:
https://developer.mozilla.org/en/CSS/CSS_transitions
How to use CSS3 Transitions: */
section {
	-moz-transition: left 400ms ease-in-out 0s;
	-webkit-transition: left 400ms ease-in-out 0s;
	-ms-transition: left 400ms ease-in-out 0s;
	transition: left 400ms ease-in-out 0s;
}

/* Before */
section { left: -150%; }
/* Now */
section[aria-selected] { left: 0; }
/* After */
section[aria-selected] ~ section { left: +150%; }

/* Incremental elements */

/* By default, visible */
.incremental > * { opacity: 1; }

/* The current item */
.incremental > *[aria-selected] { color: red; opacity: 1; }

/* The items to-be-selected */
.incremental > *[aria-selected] ~ * { opacity: 0.2; }