slideoff 0.1

data/themes/modern/styles/_box.scss

@@ -0,0 +1,89 @@
+@import 'defaults';
+
+.box {
+  color: white;
+  margin-bottom: 28px;
+  div {
+    margin: 0;
+    padding: 1px 15px;
+    font-size: 26px;
+    background-color: $grayLight;
+    &.box-header {
+      font-size: 30px;
+      background-color: $grayDark;
+      &:not(:first-child) {
+        text-indent: 0.5em;
+      }
+    }
+    &:first-child {
+      @extend .box-header;
+      border-top-right-radius: 3px;
+      border-top-left-radius: 3px;
+    }
+    &:last-child {
+      border-bottom-right-radius: 3px;
+      border-bottom-left-radius: 3px;
+    }
+  }
+
+  ul, ol {
+    margin: 0;
+    background-color: $grayLight;
+    ol, ul { // inner list
+      margin:0 0 0 2em;
+    }
+    li {
+      color: white;
+      text-indent: 0em;
+      margin-left: 0;
+      background-color: $grayLight;
+      &:before {
+        color: white;
+      }
+    }
+  }
+
+  code {
+    color: white;
+    background-color: rgba(#000, 0.33);
+    padding: 0px 0.3em;
+    font-size: 1.1em;
+  }
+}
+
+@mixin box($headerColor, $contentColor) {
+  div {
+    background-color: $contentColor;
+    &.box-header {
+      background-color: $headerColor;
+    }
+    &:first-child {
+      @extend .box-header;
+    }
+  }
+  ul, ol {
+    background-color: $contentColor;
+    li {
+      background-color: $contentColor;
+    }
+  }
+}
+
+.box-bluegreen, .box-success {
+  @include box($bluegreenDark, $bluegreenLight);
+}
+.box-green, .box-example {
+  @include box($greenDark, $greenLight);
+}
+.box-red, .box-alert {
+  @include box($redDark, $redLight);
+}
+.box-blue, .box-info {
+  @include box($blueDark, $blueLight);
+}
+.box-purple {
+  @include box($purpleDark, $purpleLight);
+}
+.box-warning, .box-orange {
+  @include box($orangeDark, $orangeLight);
+}

data/themes/modern/styles/_figure.scss

@@ -0,0 +1,81 @@
+&.cover {
+  figure {
+    position: initial;
+    max-height: initial;
+    text-align: initial;
+    vertical-align: initial;
+
+    img {
+      max-height: initial;
+    }
+  }
+}
+
+figure {
+  position: relative;
+  max-height: 450px;
+  text-align: right;
+  vertical-align: bottom;
+
+  img {
+    max-height: 100%;
+  }
+
+  figcaption {
+    font: 9px 'Open Sans', sans-serif;
+    position: absolute;
+    float: right;
+    bottom: 1em;
+    right: 0;
+    padding: 1px 3px;
+    background: rgba(#000, 0.66);
+    color: rgba(#FFF, 0.66);
+
+    > * {
+      vertical-align: middle;
+      line-height: 16px;
+      float: left;
+      margin-left: 3px;
+      &:first-child {
+        margin-left: 0px;
+      }
+      &:last-child:after {
+        display: table;
+        content: '';
+      }
+    }
+
+    .flickr {
+      background-image: url(../images/flickr.svg);
+      background-size: 15px;
+      height: 15px;
+      width: 15px;
+    }
+    .license {
+      vertical-align: middle;
+      $licenseSize: 12px;
+      display: inline-block;
+      height: 14px;
+      width: 14px;
+      background-size: $licenseSize;
+      background-repeat: no-repeat;
+
+      @each $license in cc by nc nd sa pd {
+        &.license-#{$license} {
+          background-image:url('../images/cc/#{$license}.svg');
+        }
+      }
+      &.license-cc:hover {
+        background-image:url(../images/cc/cc-white.svg);
+      }
+    }
+    a {
+      border: none;
+      color: rgba(#FFF, 0.66);
+
+      &:hover {
+        color: #FFF;
+      }
+    }
+  }
+}

data/themes/modern/styles/_full.scss

@@ -0,0 +1,74 @@
+.full {
+  position:absolute;
+  top:50%;
+  left:50%;
+  overflow:hidden;
+  margin:(-$height/2) 0 0 (-$width/2);
+  width:$width;
+  height:$height;
+  background:#000;
+  &.wide-layout {
+    margin:(-$height/2) 0 0 (-$width/2);
+    width:$width;
+    height:$height;
+  }
+  // Slide
+  .slide {
+    position:absolute;
+    top:0;
+    left:0;
+    margin-left:150%;
+    // Next
+    .next {
+      visibility:hidden;
+      &.active {
+        visibility:visible;
+      }
+    }
+    // Current
+    &:target {
+      margin:0;
+    }
+    // Shout
+    &.shout {
+      &.right, &.up, &.left, &.down {
+        h1, h2 {
+          opacity:0;
+          transition:all 0.7s ease-out;
+        }
+        &:target h2 {
+          opacity:1;
+          -webkit-transform:translateX(0) translateY(-50%);
+          transform:translateX(0) translateY(-50%);
+        }
+      }
+      &.right h2 {
+        -webkit-transform:translateX(-100%) translateY(-50%);
+        transform:translateX(-100%) translateY(-50%);
+      }
+      &.left h2 {
+        -webkit-transform:translateX(100%) translateY(-50%);
+        transform:translateX(100%) translateY(-50%);
+      }
+      &.up h2 {
+        -webkit-transform:translateX(0) translateY(100%);
+        transform:translateX(0) translateY(100%);
+      }
+      &.down h2 {
+        -webkit-transform:translateX(0) translateY(-100%);
+        transform:translateX(0) translateY(-100%);
+      }
+    }
+  }
+  @import 'increment';
+  @import 'progress';
+
+  .box.shadow {
+    box-shadow: 5px 5px 15px rgba(#000, 0.25);
+    border-radius: 3px;
+  }
+
+  .disabled {
+    display: none;
+  }
+}

data/themes/modern/styles/_increment.scss

@@ -0,0 +1,38 @@
+.inactive, .current {
+  -webkit-transition: opacity 0.5s ease-in-out 0.0s;
+}
+.inactive {
+  opacity: 0;
+}
+.visited {
+  -webkit-transition: opacity 0.5s ease-in-out 0.3s;
+  .hide-visited {
+    display: none;
+  }
+  &.hide-visited {
+    display: none;
+  }
+}
+
+.hover li.visited {
+  opacity: 0.5;
+}
+li.current {
+  opacity: 1;
+  //color: $color;
+  //font-weight: bold;
+  &:before {
+    content:'\2023\00A0\00A0\2009';
+  }
+}
+.border-separated {
+  li {
+    -webkit-transition: all 0.5s;
+  }
+  li.inactive {
+    margin-left: -400px;
+  }
+  li.current, li.visited {
+    margin-left: 0;
+  }
+}

data/themes/modern/styles/_list.scss

@@ -0,0 +1,129 @@
+.list {
+  position:absolute;
+  clip:rect(0, auto, auto, 0); // Having fun with IE10
+  padding:50px 0 50px 50px;
+  background:#E2E2E2 url(../images/mesh.png) 50% 0;
+  text-align:center;
+  @include retina {
+    background-image:url(../images/mesh@2x.png);
+    background-size:256px;
+  }
+  // Outfit
+  .caption,
+  .badge {
+    display:block;
+  }
+  // Slide
+  .slide {
+    // Gap between slides
+    $gap:50px;
+    position:relative;
+    top:$height/2 - $gap;
+    display:inline-block;
+    margin:($gap - $height/2) ($gap - $width/2) 0 0;
+    text-align:left;
+    -webkit-transform-origin:0 0;
+    transform-origin:0 0;
+    -webkit-transform:scale(0.5);
+    transform:scale(0.5);
+    @media (max-width:$break) {
+      top:$height/2 + $height/4 - $gap;
+      margin:($gap - ($height/2 + $height/4)) ($gap - ($width/2 + $width/4)) 0 0;
+      -webkit-transform:scale(0.25);
+      transform:scale(0.25);
+    }
+    // Frame
+    &:before {
+      position:absolute;
+      top:0;
+      left:0;
+      z-index:-1;
+      width:$width/2;
+      height:$height/2;
+      box-shadow:0 0 0 1px #DDD;
+      content:'';
+      -webkit-transform-origin:0 0;
+      transform-origin:0 0;
+      -webkit-transform:scale(2);
+      transform:scale(2);
+      @media (max-width:$break) {
+        width:$width/4;
+        height:$height/4;
+        -webkit-transform:scale(4);
+        transform:scale(4);
+      }
+    }
+    // Number
+    &:after {
+      top:100%;
+      bottom:auto;
+      padding-top:50px;
+      @media (max-width:$break) {
+        width:$width/2;
+        -webkit-transform-origin:0 0;
+        transform-origin:0 0;
+        -webkit-transform:scale(2);
+        transform:scale(2);
+      }
+    }
+    // Hover
+    &:hover:before {
+      box-shadow:
+      0 0 0 1px #EEE,
+      0 0 0 12px rgba(#FFF, 0.5);
+    }
+    // Current
+    &:target {
+      &:before {
+        box-shadow:
+        0 0 10px 0 darken($color, 5%),
+        0 0 0 12px $color;
+      }
+      &:after {
+        color:$color;
+      }
+    }
+    // Inner
+    > div {
+      &:before {
+        position:absolute;
+        top:0;
+        right:0;
+        bottom:0;
+        left:0;
+        z-index:2;
+        content:'';
+      }
+    }
+    // Cover Shout
+    &.cover,
+    &.shout {
+      &:after {
+        content:counter(slide) '/' attr(data-slides);
+      }
+    }
+    &.disabled {
+      opacity: 0.8;
+      -webkit-filter: grayscale(100%);
+      &:before {
+        content: '';
+        position: absolute;
+        /* opacity: 0.1; */
+        top: 0;
+        bottom: 0;
+        left: 0;
+        right: 0;
+        text-align: center;
+        /* vertical-align: middle; */
+        line-height: 310px;
+        font-size: 100px;
+        color: #F5F5F5;
+        background: rgba(#FFF, 0.4);
+        z-index: 1;
+        /* -webkit-transform: rotate(45deg); */
+        text-shadow: 5px 5px 20px rgba(0, 0, 0, 0.5);
+        text-transform: uppercase;
+      }
+    }
+  }
+}

data/themes/modern/styles/_progress.scss

@@ -0,0 +1,19 @@
+.progress {
+  position:absolute;
+  right:0;
+  bottom:0;
+  left:0;
+  z-index:1;
+  div {
+    position:absolute;
+    left:0;
+    bottom:0;
+    width:0;
+    height:8px;
+    padding-left: -10px;
+    background:url(../images/progress-grayDark.svg) 100% 0 no-repeat;
+    -webkit-background-clip: content-box;
+    background-clip: content-box;
+    transition:width 0.3s linear;
+  }
+}

data/themes/modern/styles/defaults.scss

@@ -0,0 +1,46 @@
+// Bright theme for Shower HTML presentation engine: github.com/shower/shower
+// Copyright © 2010–2013 Vadim Makeev, pepelsbey.net
+// Licensed under MIT license: github.com/shower/shower/wiki/MIT-License
+
+// Layout
+$width:1024px;  // Slide width, permanent in most cases
+$height:768px;  // Slide height, 640px for 16:10, 768px for 4:3
+$ratio:'4x3'; // Available options: '16x10' or '4x3'
+$top:60px;     // Top padding above slide content
+$left:78px;    // Left slide content padding
+$right:96px;    // Right slide content padding
+$bottom:38px;    // Bottom slide content padding
+$break:1180px;  // Window width for small thumbnails to appear
+
+// Colors
+
+$grayDark:#46413C;
+$grayLight:#AAA5A0;
+$redDark:#96000F;
+$redLight:#E10019;
+$blueDark: #327D91;
+$blueLight:#4BBEE1;
+$purpleDark:#560F32;
+$purpleLight:#821350;
+$bluegreenDark:#006450;
+$bluegreenLight:#009682;
+$greenDark:#697D19;
+$greenLight:#9BC328;
+$orangeDark:#AA5500;
+$orangeLight:#FF8200;
+
+$color:$grayDark;
+$colorCode:#E6E6E6;
+$gray:$grayDark;
+$borderColor:lightgray;
+$black1:#515151;
+$black2:darkgray;
+$linkColor:$blueDark;
+$listItemColor:$grayLight;
+
+// Mixins
+@mixin retina {
+  @media (-webkit-min-device-pixel-ratio:2), (min-resolution:192dpi) {
+    @content;
+  }
+}

data/themes/modern/styles/fonts.scss

@@ -0,0 +1,197 @@
+// Bright theme for Shower HTML presentation engine: github.com/shower/shower
+// Copyright © 2010–2013 Vadim Makeev, pepelsbey.net
+// Licensed under MIT license: github.com/shower/shower/wiki/MIT-License
+
+// Yanone Kaffeesatz
+@font-face {
+  font-family: 'Yanone Kaffeesatz';
+  font-style: normal;
+  font-weight: 200;
+  src: local('Yanone Kaffeesatz ExtraLight'), local('YanoneKaffeesatz-ExtraLight'), url(../fonts/YanoneKaffeesatz.ExtraLight.woff) format('woff');
+}
+@font-face {
+  font-family: 'Yanone Kaffeesatz';
+  font-style: normal;
+  font-weight: 300;
+  src: local('Yanone Kaffeesatz Light'), local('YanoneKaffeesatz-Light'), url(../fonts/YanoneKaffeesatz.Light.woff) format('woff');
+}
+@font-face {
+  font-family: 'Yanone Kaffeesatz';
+  font-style: normal;
+  font-weight: 400;
+  src: local('Yanone Kaffeesatz Regular'), local('YanoneKaffeesatz-Regular'), url(../fonts/YanoneKaffeesatz.Regular.woff) format('woff');
+}
+@font-face {
+  font-family: 'Yanone Kaffeesatz';
+  font-style: normal;
+  font-weight: 700;
+  src: local('Yanone Kaffeesatz Bold'), local('YanoneKaffeesatz-Bold'), url(../fonts/YanoneKaffeesatz.Bold.woff) format('woff');
+}
+
+// Goudy Bookletter
+@font-face {
+  font-family:'Goudy Bookletter 1911';
+  src:url(../fonts/GoudyBookletter.1911.woff) format('woff');
+}
+
+// Raleway
+@font-face {
+  font-family:'Raleway';
+  src:url(../fonts/Raleway.Thin.woff) format('woff');
+}
+
+// Juction
+@font-face {
+  font-family:'Junction';
+  src:url(../fonts/Junction.woff) format('woff');
+}
+
+// Open Sans WOFF
+@font-face {
+  font-family:'Open Sans';
+  src:url(../fonts/OpenSans.Regular.woff) format('woff');
+}
+@font-face {
+  font-weight:700;
+  font-family:'Open Sans';
+  src:url(../fonts/OpenSans.Bold.woff) format('woff');
+}
+@font-face {
+  font-weight:700;
+  font-style:italic;
+  font-family:'Open Sans';
+  src:url(../fonts/OpenSans.BoldItalic.woff) format('woff');
+}
+@font-face {
+  font-weight:600;
+  font-family:'Open Sans';
+  src:url(../fonts/OpenSans.Semibold.woff) format('woff');
+}
+@font-face {
+  font-weight:600;
+  font-style:italic;
+  font-family:'Open Sans';
+  src:url(../fonts/OpenSans.SemiboldItalic.woff) format('woff');
+}
+@font-face {
+  font-weight:800;
+  font-family:'Open Sans';
+  src:url(../fonts/OpenSans.ExtraBold.woff) format('woff');
+}
+@font-face {
+  font-weight:800;
+  font-style:italic;
+  font-family:'Open Sans';
+  src:url(../fonts/OpenSans.ExtraBoldItalic.woff) format('woff');
+}
+@font-face {
+  font-style:italic;
+  font-family:'Open Sans';
+  src:url(../fonts/OpenSans.Italic.woff) format('woff');
+}
+@font-face {
+  font-weight:300;
+  font-family:'Open Sans';
+  src:url(../fonts/OpenSans.Light.woff) format('woff');
+}
+@font-face {
+  font-family:'Open Sans Light';
+  src:url(../fonts/OpenSans.Light.woff) format('woff');
+}
+@font-face {
+  font-weight:300;
+  font-style:italic;
+  font-family:'Open Sans';
+  src:url(../fonts/OpenSans.LightItalic.woff) format('woff');
+}
+
+/* PTSans */
+@font-face {
+  font-family:'PT Sans';
+  src:local('PT Sans'), local('PTSansRegular'),
+  url(../fonts/PTSans.woff) format('woff');
+}
+@font-face {
+  font-weight:bold;
+  font-family:'PT Sans';
+  src:local('PT Sans Bold'), local('PTSansBold'),
+  url(../fonts/PTSans.Bold.woff) format('woff');
+}
+@font-face {
+  font-style:italic;
+  font-family:'PT Sans';
+  src:local('PT Sans Italic'), local('PTSansItalic'),
+  url(../fonts/PTSans.Italic.woff) format('woff');
+}
+@font-face {
+  font-style:italic;
+  font-weight:bold;
+  font-family:'PT Sans';
+  src:local('PT Sans Bold Italic'), local('PTSansBoldItalic'),
+  url(../fonts/PTSans.Bold.Italic.woff) format('woff');
+}
+@font-face {
+  font-family:'PT Sans Narrow';
+  src:local('PT Sans Narrow'), local('PTSansNarrow'),
+  url(../fonts/PTSans.Narrow.woff) format('woff');
+}
+@font-face {
+  font-family:'PT Sans Narrow';
+  font-weight:bold;
+  src:local('PT Sans Narrow Bold'), local('PTSansNarrowBold'),
+  url(../fonts/PTSans.Narrow.Bold.woff) format('woff');
+}
+
+/* PT Mono */
+@font-face {
+  font-family:'PT Mono';
+  src:local('PT Mono'), local('PTMonoRegular'),
+  url(../fonts/PTMono.woff) format('woff');
+}
+
+/* Linker */
+@font-face {
+  font-family:'Target Blank';
+  src:url(../fonts/TargetBlank.otf) format('opentype'),
+  url(../fonts/TargetBlank.svg#TargetBlank) format('svg');
+}
+
+/* Inconcolata */
+@font-face {
+  font-family: 'Inconsolata';
+  font-style: normal;
+  font-weight: 400;
+  src:local('Inconsolata'),
+  url(../fonts/Inconsolata.woff) format('woff');
+}
+@font-face {
+  font-family: 'Inconsolata';
+  font-style: normal;
+  font-weight: 700;
+  src:local('Inconsolata Bold'), local('Inconsolata-Bold'),
+  url(../fonts/Inconsolata.Bold.woff) format('woff');
+}
+
+// STIX Math
+@font-face {
+  font-family:'Stix';
+  src:url(../fonts/STIXGeneral.Regular.woff) format('woff');
+}
+@font-face {
+  font-family:'Stix';
+  font-style: normal;
+  font-weight: bold;
+  src:url(../fonts/STIXGeneral.Bold.woff) format('woff');
+}
+@font-face {
+  font-family:'Stix';
+  font-style: italic;
+  font-weight: bold;
+  src:url(../fonts/STIXGeneral.BoldItalic.woff) format('woff');
+}
+@font-face {
+  font-family:'Stix';
+  font-style: italic;
+  src:url(../fonts/STIXGeneral.Italic.woff) format('woff');
+}
+