.columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  height: 80vh;
}   

.col {
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.options {
    border: 1px solid #d4d4d0;
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}

.ballot-status {
    color: red;
}

.opt {
    cursor: move; /* fallback if grab cursor is unsupported */
    cursor: grab;
    cursor: -moz-grab;
    cursor: -webkit-grab;
    border: 1px solid #aaa;
    border-radius: 8px;
    padding: 0.75rem;
}

a.login-button {
    padding: 1px 6px;
    border: 1px outset buttonborder;
    border-radius: 3px;
    color: buttontext;
    background-color: buttonface;
    text-decoration: none;
    display: inline-block;
    margin-top: 8px;
    margin-bottom: 10px;
}

a.results-button {
    padding: 1px 6px;
    border: 1px outset buttonborder;
    border-radius: 3px;
    color: buttontext;
    background-color: buttonface;
    text-decoration: none;
    display: inline-block;
    margin-top: 8px;
    margin-bottom: 10px;
}

.submit-button {
    padding: 1px 6px;
    border: 1px outset buttonborder;
    border-radius: 3px;
    color: buttontext;
    background-color: buttonface;
    text-decoration: none;
    appearance: none;
    -webkit-appearance: none;
    font-family: inherit;
    font-size: inherit;
    margin-top: 8px;
    margin-bottom: 10px;
}

.opt::before {
    content: "\283F";
    margin-right: 8px;
    color: #999;
    font-size: 16px;
}

.opt:active {
    cursor: move; /* fallback if grab cursor is unsupported */
    cursor: grab;
    cursor: -moz-grab;
    cursor: -webkit-grab;
}
