//@import url(https://fonts.googleapis.com/css?family=Open+Sans:regular,semibold,italic,italicsemibold|PT+Sans:400,700,400italic,700italic|PT+Serif:400,700,400italic,700italic|Cutive+Mono)

@import url('https://fonts.googleapis.com/css?family=Roboto')

.fallback-message
  font-family: sans-serif
  line-height: 1.3

  width: 780px
  padding: 10px 10px 0
  margin: 20px 0

  border: 1px solid #E4C652
  border-radius: 10px
  background: #EEDC94

.fallback-message p
  margin-bottom: 10px

.impress-supported .fallback-message
  display: none

body
  font-family: Roboto, sans-serif
  min-height: 740px

  background: #aaccbb
  color: #ff4466

.step
  position: relative
  display: block

  width: 1200px
  height: 900px
  margin: 20px auto
  padding: 40px 60px

  text-shadow: 0 2px 2px rgba(0, 10, 0, 0.5)
  font-size: 30px
  letter-spacing: -1px

.impress-enabled .step
  margin: 0

.notes
  display: none

h1, h2, h3
  margin-bottom: 0.5em
  margin-top: 0.5em
  text-align: center

p
  text-align: center
  margin: 0.7em

li
  margin: 0.2em

a
  color: inherit
  text-decoration: none
  padding: 0 0.1em
  background: rgba(200, 200, 100, 0.9)
  text-shadow: -1px 1px 2px rgba(100, 100, 100, 0.9)
  border-radius: 0.2em
  border-bottom: 1px solid rgba(100, 100, 100, 0.4)
  border-left: 1px solid rgba(100, 100, 100, 0.4)

  -webkit-transition: 0.5s
  -moz-transition: 0.5s
  -ms-transition: 0.5s
  -o-transition: 0.5s
  transition: 0.5s

  &:hover, &:focus
    background: rgba(200, 200, 2000, 1)
    text-shadow: -1px px 2px rgba(100, 100, 100, 0.5)

blockquote, q
  font-style: italic
  font-weight: 400

em, q
  text-shadow: 0 2px 2px rgba(0, 0, 0, 0.3)

strong
  text-shadow: -1px 1px 2px rgba(100, 100, 100, 0.5)

strike
  opacity: 0.7

small
  font-size: 0.4em

img
  width: 300px

.impress-enabled
  pointer-events: none
  & #impress, #impress-toolbar
    pointer-events: auto
  & #impress-help
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.5)
    color: #EEEEEE
    font-size: 80%
    position: fixed
    left: 2em
    bottom: 2em
    width: 24em
    border-radius: 1em
    padding: 1em
    text-align: center
    z-index: 100
    font-family: Roboto, serif
    & td
      padding-left: 1em
      padding-right: 1em

  & div#impress-toolbar
    position: fixed
    right: 1px
    bottom: 1px
    opacity: 0.6
    z-index: 10
    & span
      margin-right: 10px

body.impress-mouse-timeout
  cursor: none
  & div#impress-toolbar
    display: none

.impress-progressbar
  position: absolute
  right: 118px
  bottom: 1px
  left: 118px
  border-radius: 7px
  border: 2px solid rgba(100, 100, 100, 0.2)
  & DIV
    width: 0
    height: 2px
    border-radius: 5px
    background: rgba(75, 75, 75, 0.4)
    -webkit-transition: width 1s linear
    -moz-transition: width 1s linear
    -ms-transition: width 1s linear
    -o-transition: width 1s linear
    transition: width 1s linear

.impress-progress
  position: absolute
  left: 59px
  bottom: 1px
  text-align: left
  font-size: 10px
  opacity: 0.6