/*
 * INIT
 * --------------------------------------
 */

    @-ms-viewport {
        width: device-width;
    }

    * {
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }

    body {
        background-color: #fff;
        margin: 0;
        padding: 0;
        font: 14px "Open Sans", sans-serif;
        color: #555;
    }

/*
 * LAYOUT
 * --------------------------------------
 */

    #wrapper {
        position: relative;
        margin: 0 auto;
        max-width: 900px;
        padding: 20px;
    }

    .pod {
        position: relative;
        padding: 10px;
        border: solid 1px #ddd;
    }

    .heading {
        display: flex;
        width: 100%;
        justify-content: space-between;
    }

    .heading .title {
        font-size: 16px;
        line-height: 36px;
        height: 26px;
        margin: 0 0 10px 0;
        color: #444;
        text-transform: uppercase;
    }

    .heading select {
        border: solid 1px #eee;
        font: inherit;
        color: #666;
        padding: 3px;
        margin: 0;
    }

    label {
        font-size: 14px;
        text-transform: uppercase;
        color: #555;
        margin: 0 0 5px 0;
    }

    button {
        width: 100%;
        background-color: #222;
        color: #fff;
        padding: 8px;
        border: none;
        margin: 0 0 15px 0;
    }

    textarea {
        border: solid 1px #ccc;
        width: 100%;
        height: 100px;
        font: 12px Consolas, monospace;
        color: #555;
        padding: 10px;
        margin: 0 0 15px 0;
    }

    #result {
        border: solid 1px #ccc;
        width: 100%;
        height: 100px;
        font: 12px Consolas, monospace;
        color: #555;
        padding: 10px;
        overflow-y: scroll;
    }