<!DOCTYPE html>
<html lang="en">
<head>
    <title>Shower Presentation Engine</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="node_modules/@shower/<%= theme %>/styles/styles.css">
    <style>
        .shower {
            --slide-ratio: calc(<%= ratio %>);
        }
    </style>
</head>
<body class="shower list">

    <header class="caption">
        <h1>Shower Presentation Engine</h1>
        <p>Yours Truly, Famous Inc.</p>
    </header>

    <section class="slide">
        <!-- Create your first slide -->
    </section>

    <footer class="badge">
        <a href="https://github.com/shower/shower">Fork me on GitHub</a>
    </footer>

    <div class="progress"></div>

    <script src="node_modules/@shower/core/dist/shower.js"></script>
    <!-- Copyright © <%= year %> Yours Truly, Famous Inc. -->

</body>
</html>
