@font-face {
    font-family: 'typewriterhandmedium';
    src: url('fonts/typewriterhand-webfont.eot');
    src: url('fonts/typewriterhand-webfont.eot?#iefix') format('embedded-opentype'),
    url('fonts/typewriterhand-webfont.woff2') format('woff2'),
    url('fonts/typewriterhand-webfont.woff') format('woff'),
    url('fonts/typewriterhand-webfont.ttf') format('truetype'),
    url('fonts/typewriterhand-webfont.svg#typewriterhandmedium') format('svg');
    font-weight: normal;
    font-style: normal;

}

body {
    background:#f1f1f1;
    box-sizing: border-box;
    color: #333;
    font-family: typewriterhandmedium, Consolas, Monaco, monospace;
    padding: 3em;
    width: 50%;
    transition: padding 0.3s linear,
                width 0.3s ease;
}

p {
    font-family: Consolas, Monaco, monospace;
    font-size: 18px;
    line-height: 1.5em;
}

.module,
.module li {
    margin: 0 0 3em 0;
    padding: 0;
    list-style: none;
}

.highlight { border-bottom: 1px solid #333 }

@media (max-width: 760px) {
    body {
        padding: 1.5em;
        width: 100%;
    }
}