@font-face {
    font-family: Karla;
    src: url(/Karla-Regular.ttf);
}

body {
    overflow-y: scroll;
}

.content {
    margin: 0 auto;
    padding: 0 20px;
    max-width: 960px;
    margin-bottom: 20px;
    line-height: 1.6em;
}

a {
    color: #0077ee;
}

html, select {
    font-family: 'Times New Roman', Times, serif;
    font-size: 14pt;
}

h1 {
    font-family: 'Karla', sans-serif;
    font-size: 30pt;
    letter-spacing: 5pt;
    line-height: 1em;
    text-align: center;
}

textarea {
    font-size: 12pt;
    width: calc(100% - 10px);
    box-sizing: border-box;
    font-family: monospace;
    white-space: pre;
    overflow: auto;
    margin: 0px 5px 0px 5px;
    border: 1px solid black;
}

p {
    margin: 10px 0px 10px 0px;
}

ul {
    margin-top: 2px;
    margin-bottom: 2px;
}

.formrow {
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 5px; 
    margin: 0px 0px 10px 0px;
    padding: 0px;
}

.formsection {
    display: inline-block;
    width: 70px;
    background-color: #eee;
    padding: 0px;
    margin: 0px 10px 0px 0px;
    border: 1px solid black;
    border-radius: 5px; 
    text-align: center;
    vertical-align: top;
}

.formdetails {
    display: inline-block;
    width: calc(100% - 140px);
    vertical-align: top;
}

.formletter {
    font-size: 20pt;
    margin: 0px;
    padding: 0px;
    line-height: 1.1em;
}

.formsubtitle {
    font-size: 12pt;
    margin: 0px;
    padding: 0px;
    line-height: 1.1em;
}

.scripterror {
    background-color: rgb(255, 181, 181);
    padding: 2px 6px;
    margin: 10px 0px 10px 0px;
    border: 1px solid black;
    border-radius: 5px; 
}

.pagebox {
    background-color: #eee;
    padding: 2px 6px;
    margin: 10px 0px 10px 0px;
    border: 1px solid black;
    border-radius: 5px; 
}

.but {
    padding: 8px 24px;
    margin: 0px 0px 0px 0px;
    color: #000;
    background-color: #85c2ff;
    border: 1px solid black;
    border-radius: 5px;
    font-size: 14pt;
}

.detbut {
    float: right;
    margin: 5px;
}

.ddesc {
    margin:5px;
    padding:5px;
    background-color: #fff;
    border: 1px solid black;
    border-radius: 5px;
}

button.but:hover {
    background-color: #60b0ff;
}

button.but:active {
    background-color: #41a0ff;
}

details > summary {
    cursor: pointer;
    width: max-content;
}

.includeKeyText {
    white-space: nowrap;
    margin: 0px 10px 0px 5px;
}

.transposeDiv {
    margin: 0 auto;
}
