@pink1: #2b151c;
@pink2: #734043;
@mint1: #96c0a5;
@mint2: #c1d9c2;
@mint3: #fafaf5;
@text: black;
@headerText: black;
@linkText: #505950;
@bullet: desaturate(lighten(@text, 40%), 15%);

@codeBackground: #fdf6e3;
@code: #002b36;

@codeString: #2aa198;
@codeKeyword: #b58900;
@codeComment: #93a1a1;
@codeType: #268bd2;
@codeLiteral: #d33682;
@codePunctuation: #657b83;
@codeDecimal: #d33682;
@codeOpenParen: #657b83;
@codeCloseParen: #657b83;
@codeHtmlTag: #6c71c4;
@codeHtmlAttribute: #859900;
@codeHtmlValue: #2aa198;

// @font-face {
//     font-family: 'Helvetica';
//     src: url('../fonts/Helvetica.ttf') format('truetype');
//     font-weight: normal;
//     font-style: normal;
// }

// @font-face {
//     font-family: 'Helvetica';
//     src: url('../fonts/HelveticaBold.ttf') format('truetype');
//     font-weight: bold;
//     font-style: normal;
// }

// @font-face {
//     font-family: 'Helvetica';
//     src: url('../fonts/HelveticaOblique.ttf') format('truetype');
//     font-weight: normal;
//     font-style: oblique;
// }

// @font-face {
//     font-family: 'Helvetica';
//     src: url('../fonts/HelveticaBoldOblique.ttf') format('truetype');
//     font-weight: bold;
//     font-style: oblique;
// }

@standardFont: 'Helvetica Neue LT Std', 'Helvetica', 'Arial', 'DejaVu Sans', sans-serif;
@codeFont: 'Ubuntu Mono', monospace;

body {
    font-family: @standardFont;
    font-size: 36pt;
    font-weight: 200;
    letter-spacing: -0.02em;
    color: @text;
    background: @mint3;
}

.reveal {
    section {
        background: #fff;
        border-radius: 0.2em;
    }

    // Headers

    h1, h2, h3, h4, h5, h6 {
        margin: 0.5em 0 0.5em 0;
        color: @headerText;
        line-height: 0.9em;
        letter-spacing: 0.02em;

        font-weight: normal;
        text-transform: uppercase;
        text-decoration: underline;
        text-shadow: 1px 1px 4px fade(@text, 40%);
    }

    h1 {
        font-size: 96pt;
    }

    h2 {
        font-size: 64pt;
    }

    h3 {
        font-size: 48pt;
    }

    // Typography

    p, li, blockquote {
        font-size: 32pt;
        text-shadow: 1px 1px 4px fade(@text, 40%);
        line-height: 40pt;
        text-align: left;
    }

    p {
        margin-left: 2em;
        margin-right: 2em;
    }

    strong {
        letter-spacing: 0.05em;
    }

    blockquote {
        background: darken(@mint3, 5%);
    }

    // Links

    a:not(.image) {
        color: @linkText;
        text-decoration: underline;
        text-shadow: 1px 1px 4px fade(@linkText, 50%);

        -webkit-transition: all .15s ease;
        -moz-transition: all .15s ease;
        -ms-transition: all .15s ease;
        -o-transition: all .15s ease;
        transition: all .15s ease;

        &:hover {
            color: lighten(@linkText, 20%);
            text-shadow: 1px 1px 4px fade(lighten(@linkText, 20%), 75%);
        }
    }

    // Lists

    ol {
        counter-reset: li;

        li:before {
            content: counters(li, ".", decimal) ".";
            counter-increment: li;
        }
    }

    ul {
        li:before {
            content: '✤';
        }
    }

    ul, ol {
        margin: 0.3em 1em;
        padding-left: 1em;

        li {
            list-style: none;
            position: relative;
            margin-bottom: 0.5em;

            &:before {
                color: @bullet;
                text-align: right;
                position: absolute;
                left: 0;
                width: 2em;
                margin-left: -2.3em;
                text-shadow: 0 2px 2px fade(@bullet, 60%);
            }
        }
    }

    .small, .small li {
        font-size: 24pt;
        line-height: 32pt;
    }

    .centre {
        text-align: center;
    }

    // Images

    section img {
        margin: 30px 0 0 0;

        box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);

        -webkit-transition: all .2s linear;
        -moz-transition: all .2s linear;
        -ms-transition: all .2s linear;
        -o-transition: all .2s linear;
        transition: all .2s linear;

        &.plain {
            box-shadow: none;
        }
    }

    a:hover img {
        -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.55);
        -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.55);
        box-shadow: 0 0 20px rgba(0, 0, 0, 0.55);
    }

    // Code

    pre {
        box-shadow: 0 4px 16px fade(@codeBackground, 60%);
        padding: 0.5em 1em;
        border-radius: 0.3em;
        border: 1px solid darken(@codeBackground, 10%);
        margin: 0;
    }

    code {
        font-size: 28pt;
        border: 1px solid darken(@codeBackground, 10%);
        border-radius: 0.2em;
        letter-spacing: -0.04em;
    }

    pre > code {
        font-size: inherit;
        border: none;
        letter-spacing: inherit;
    }

    pre, code {
        background: @codeBackground;
        color: @code;
        font-family: @codeFont;

        .codeColour (@colour) {
            color: darken(@colour, 10%);
            text-shadow: 0 1px 4px fade(@colour, 30%);
        }

        .pln { .codeColour(@code); }
        .str { .codeColour(@codeString); }
        .kwd { .codeColour(@codeKeyword); }
        .com { .codeColour(@codeComment); }
        .typ { .codeColour(@codeType); }
        .lit { .codeColour(@codeLiteral); }
        .pun { .codeColour(@codePunctuation); }
        .dec { .codeColour(@codeDecimal); }
        .opn { .codeColour(@codeOpenParen); }
        .clo { .codeColour(@codeCloseParen); }
        .tag { .codeColour(@codeHtmlTag); }
        .atn { .codeColour(@codeHtmlAttribute); }
        .atv { .codeColour(@codeHtmlValue); }
    }

    // Navigation controls

    .controls a {
        color: @linkText;
        text-decoration: none;
    }

    .controls a.enabled {
        color: @linkText;
        text-shadow: 0px 0px 2px lighten(@linkText, 30%);
    }

    .pic-label {
        margin-top: -1.5em;
        color: black;
        text-shadow: 0 0 6px white;
    }

    .pic-label.the-wadler {
        margin: -4em -2em 1.5em -2em;
        font-size: 22pt;
        color: white;
        line-height: 32pt;
        font-weight: bold;
        text-shadow: 2px 2px 2px black,
                     2px -2px 2px black,
                     -2px 2px 2px black,
                     -2px -2px 2px black;

        .problem {
            font-size: 32pt;
        }
    }

    .pic-label.quote {
        margin: -3.5em -2em 1em -2em;
        font-size: 32pt;
        color: white;
        line-height: 40pt;
        font-weight: bold;
        text-shadow: 2px 2px 2px black,
                     2px -2px 2px black,
                     -2px 2px 2px black,
                     -2px -2px 2px black;
        .big {
            font-size: 40pt;
        }
    }

    .pic-label.big {
        margin: -1.75em -2em 0.75em -2em;
        font-size: 48pt;
        line-height: 64pt;
        font-weight: bold;
        text-shadow: 2px 2px 2px white,
                     2px -2px 2px white,
                     -2px 2px 2px white,
                     -2px -2px 2px white;
    }

    .pic-label.bigger {
        margin-top: -1.25em;
        margin-bottom: 0.25em;
        font-size: 80pt;
        line-height: 96pt;
        font-weight: bold;
        text-shadow: 2px 2px 2px white,
                     2px -2px 2px white,
                     -2px 2px 2px white,
                     -2px -2px 2px white;
    }

    .pic-label.roketto-dan {
        margin-top: -3.75em;
        margin-bottom: 2.5em;
        font-size: 80pt;
        line-height: 96pt;
        font-weight: bold;
        text-shadow: 4px 4px 4px white,
                     4px -4px 4px white,
                     -4px 4px 4px white,
                     -4px -4px 4px white;
        -webkit-transform: scaleY(1.5);
    }

    .pic-label.x-big {
        margin-top: -0.75em;
        margin-bottom: 0.35em;
        font-size: 4em;
        font-weight: bold;
        text-shadow: 4px 4px 4px white,
                     4px -4px 4px white,
                     -4px 4px 4px white,
                     -4px -4px 4px white;
    }

    .title-slide {
        h3 {
            font-size: 44pt;
            margin-top: 0.5em;
        }

        img {
            box-shadow: none;
        }
    }

    .final-slide {
        h3 {
            margin-bottom: -0.5em;
        }
    }

    #ponies li {
        font-size: 20pt;
        line-height: 24pt;
    }
}
