/**************************************************************************************************/

@font-face
    {
    font-family: 'permian';
    src: url('permian.eot');
    src: url('permian.eot?#iefix') format('embedded-opentype'),
         url('permian.woff') format('woff'),
         url('permian.ttf') format('truetype'),
         url('permian.svg#svgFontName') format('svg');
    }

body
    {
    background: url(just-waves.png);
    text-align: center;
    line-height: 1.55;
    font-family: 'permian', sans-serif;
    font-size: 1.1em;
    }

#out
    {
    background-color: white;
    margin: 1em;
    padding: 1em;
    display: inline-block;
    border-radius: 2em;
    border: solid 0.5em #a1e2ff;
    box-shadow: 0 0 10em white;
    max-width: 40em;
    }

a
    {
    color: #ff5575;
    font-weight: bolder;
    }

ul
    {
    text-align: left;
    }

.b
    {
    font-size: 2em;
    font-weight: bolder;
    margin: 0;
    }

.c
    {
    font-family: monospace;
    border: dashed 0.25em #a1e2ff;
    padding: 0.25em;
    padding-left: 0.5em;
    padding-right: 0.5em;
    border-radius: 1em;
    }

.t
    {
    margin: 0;
    }

#x
    {
    width: 10em;
    }

pre
    {
    color: #5e1d00;
    }

tt
    {
    border: dashed 0.2em #a1e2ff;
    padding: 0.25em;
    padding-left: 0.5em;
    padding-right: 0.5em;
    font-size: larger;
    border-radius: 0.751em;
    }

input
    {
    border: dashed 0.25em #a1e2ff;
    padding: 0.25em;
    padding-left: 0.5em;
    padding-right: 0.5em;
    font-size: larger;
    border-radius: 1em;
    white-space: nowrap;
    font-family: monospace;
    text-align: center;
    outline: none;
    }

td
    {
    text-align: left;
    padding-right: 1.5em;
    font-family: monospace;
    }

/**************************************************************************************************/