body {
    font-family: Calibri, sans-serif;
    min-width:320px;
}

.arguments {
    min-width:300px;
}

.result {
    min-width:300px;
}

textarea, input[type="text"] {
    padding:5px;
}

input[type="submit"] {
    padding:10px 20px;
    background-color: black;
    color:white;
    border-style: solid;
    border-color: black;
}

.header, .arguments {
    padding:10px 10px 10px 10px;
}

.header {
    background-color:black;
    color:white;
}

h1 {
    font-size:x-large;
    margin-bottom:5px;
}

h1 a {
    text-decoration:none;
}

a, a:visited {
    color:inherit;
}

.content {
    display:flex;
    flex-wrap:wrap;
}

.arguments {
    flex:1;
}

.result {
    flex:2;
}

.argument {
    display:flex;
    flex-wrap: wrap;
    margin-bottom:10px;
}

.argument .label {
    width:130px;
    text-align: right;
}

.argument .value {
    flex:1;
    text-align: right;
    margin-left:5px;
}

.argument .value input[type="text"] {
    width:90%;
}

.argument textarea {
    width:95%;
    height:130px;
}

.result .image img {
    width:95%;
    max-width:800px;
}

.result .log {
    font-family:Courier, monospace;
    font-size: x-small;
    color:gray;
    padding:0px 0px 20px 20px;
}
