::root {
    --font-mono: 0.5;
    --font-casl: 0.49;
    --font-wght: 400;
    --font-slnt: 0;
    --font-rep-roman: 1;
}

body {
    font-family: 'Recursive', sans;
    font-variation-settings: var(--font-mono), var(--font-casl), var(--font-wght), var(--font-slnt), var(--font-rep-roman);
    background: lightgrey;

}

header {

}

main {
    border: 1px #666 solid;
    border-radius: 1ch;
    background: white;
    box-shadow: 0.5ch 0.5ch 1ch #bbb;
    padding: 1ch;
}

th, td {
    padding: 0 0.5ch;
}

.vcenter{
    position: absolute;
    top: 50%;
    transform: translateY(-50%)
}
.hcenter{
    position:absolute;
    left: 50%;
    margin-right: -50%;
    transform: translateX(-50%)
}

.cl-form {
    display: flex;
    flex-direction: column;
}
.cl-from {
    display: flex;
    margin-bottom: 1ch;
}
.cl-to {
    display: flex;
    margin-bottom: 1ch;
}
.cl-submit {
    width: 100%;
}
.cl-form-deco {
    margin: 0 1ch;

}

#id_to { flex-grow: 1;}