body {
    font-family: Helvetica, sans-serif;
    width: 900px;
    margin: auto auto 80px;
}

h3 {
    color: #505050;
    margin: 10px 0;
}

section.machine {
    margin-top: 40px;
    margin-left: 20px;
}
    ul.tape {
        margin: 0;
        padding: 0;
        height: 32px;
    }

        ul.tape li {
            list-style-type: none;
            border: 1px solid #aeaeae;
            float: left;
            width: 30px;
            height: 23px;
            text-align: center;
            padding-top: 7px;
            border-right: none;
            color: gray;
        }

        ul.tape li:last-child {
            border: 1px solid #aeaeae;
        }

        section.machine div.pointer {
           float: left;
           width: 31px;
        }

        section.machine div.pointer em {
            background-color: #696969;
            display: inline-block;
            width: 10px;
            height: 15px;
            margin-top: 6px;
            margin-left: 10px;
        }

        section.machine div.pointer em:before {
            content: "";
            display: block;
            width: 0;
            height: 0;
            border-left: 5px solid transparent;
            border-right: 5px solid transparent;
            border-bottom: 5px solid #696969;
            margin-top: -5px;
        }

        section.editor {
            margin: 40px 18px;
        }

        section.editor .actions {
            margin-bottom: 10px;
        }

        section.editor .actions:after {
            display: block;
            content: '';
            clear: both;
            width: 0;
            height: 0;
        }

        section.editor #source,
        section.editor #preview {
            width: 815px;
            height: 400px;
            line-height: 1.3;
            background-color: #5b5b5b;
            border: 3px solid #3e3e3e;
            resize: vertical;
            outline: none;
            font-size: 20px;
            color: #fff;
            font-family: monospace;
            padding: 10px;
            white-space: pre;
            display: block;
            overflow: scroll;
            word-wrap: normal;
        }

        section.editor #preview {
            /*display: none;*/
        }

        section.editor #input-box {
            float: right;
            margin-right: 220px;
            color: gray;
            height: 20px;
            display: none;
        }

        section.editor #input {
            margin-left:5px;
            padding: 10px;
            background-color: #eeeeee;
            border: none;
            width: 20px;
            font-size: 16px;
            text-align: center;
            outline:none;
        }

        section.editor #delay-box {
            float: right;
            margin-right: 25px;
        }

        section.editor #delay-box label {
            display: block;
            color: gray;
        }

        section.editor #delay-box input {

        }
        
        section.editor #optimize-box {
            float: right;
            margin-right: 25px;
            text-align:center;
        }

        section.editor #optimize-box label {
            display: block;
            color: gray;
        }

        section.editor #optimize-box input {
          
        }

        section.editor #exclaim-box {
            float: right;
            margin-right: 25px;
            text-align:center;
        }

        section.editor #exclaim-box label {
            display: block;
            color: gray;
        }

        section.editor #exclaim-box input {
          
        }

        section.editor span.caret {
            border-radius: 4px;
            background-color: #fff;
            color: #000;
        }

        section.editor .button {
            padding: 10px 20px;
            margin-right: 10px;
            background-color: #eeeeee;
            display: block;
            float: left;
            color: gray;
            text-decoration: none;
        }
        section.editor .hidden {
            display: none;
        }
        section.editor .button:active {
            background-color: #e9e9e9;
        }

    #interpreter #output {
        font-family: monospace;
        font-size: 17px;
        margin: 0 22px 0 0;
        background-color: #eeeeee;
        min-height: 1.2em;
        padding: 10px;
        color: #5d5d5d;
        overflow: auto;
    }

    #interpreter #output.error {
        color: #d8000c;
        background-color: #ffcbcb;
    }

    a {
        color: #575757;
    }

    table {
        padding: 4px 10px;
    }

    table td {
        padding: 10px;
        color: #494949;
    }

    section#info {
        margin: 0 20px;
    }

