div.slide {counter-increment: slide}

@media print {
.screen, .notes { display:none }
#op { position: fixed; top: 0cm; left: 0cm; border: 0px solid }
body {font-size: 25px }
div,h1 { margin: 0.5em}
 dt { line-height: 130% ; font-size:120% ; font-weight: bold }
 li { line-height: 150% }
 h1 { font-size: 170% }
#first, #last, h1 { text-align:center}
#first { page-break-before:avoid }
.slide { page-break-before:always ; padding: .5em  3em ; background: url('operas.svg') #fff; height:100% }
}

@media projection {
.screen, .notes { display:none }
:link, :visited { color:#ddf }
body { color: #fff; background-color: #000 ; font: Arial }
.right { float: right; margin-top: .1em; margin-bottom: .1em; margin-left: 1em; max-width:50%; text-align:right }
#op {display:none}
div,h1 { margin: 0.5em}
 dt { line-height: 130% ; font-size:120% ; font-weight: bold }
 li { line-height: 150% }
 h1 { font-size: 170% }
#first, #last, h1, .centre { text-align:center}
.slide { page-break-before:always ; padding: .5em  2em ; background: url('operalogo.svg') ; height:100% }
#first { page-break-before:avoid }

#dom { background: url('dfly/dom.svg') }
#console{ background: url('dfly/console.svg') }
#style { background: url('dfly/style.svg') }
     }

@media screen {
 .notes { font-style: italic; color: #aaa}
 .notes:before { content: 'notes: ' }
 .centre { text-align:center }
 h1:after{ content: " (" counter(slide) ")"}
 .right { float: right; margin-top: 1em; margin-bottom: 1em; margin-left: 1em; max-width:50% }
}

@media projection and (min-device-height: 450px) { body {font-size:20px} .slide {height:400px } }
@media projection and (min-device-height: 600px) { body {font-size:30px} .slide {height:550px } }
@media projection and (min-device-height: 800px) { body {font-size:40px} .slide {height:750px } }
@media projection and (min-device-height: 760px) { body {font-size:38px} .slide {height:730px } }
@media projection and (min-device-height: 900px) { body {font-size:45px} .slide {height:850px } }
@media projection and (min-device-height:1000px) { body {font-size:50px} .slide {height:950px } }