a { color: var(--blue); text-decoration: underline; cursor: pointer; }

.textarea { display: inline-block; vertical-align: top; border: 1px solid var(--dark); position: relative; }
.textarea > .label { position: absolute; top: -15px; left: 5px; font-size: 10px; line-height: 12px; }
.textarea > textarea { vertical-align: top; width: calc(100% - 10px); height: 18px; padding: 5px; margin: 0; font-family: txt; font-size: 12px; line-height: 18px; color: var(--dark); background: transparent; border: none; outline: none; resize: none; }
.textarea > textarea::placeholder { color: var(--dark); opacity: 0.5; }

.select { display: inline-block; vertical-align: top; border: 1px solid var(--dark); position: relative; }
.select > .label { position: absolute; top: -15px; left: 5px; font-size: 10px; line-height: 12px; }
.select > .txt { display: inline-block; vertical-align: top; width: calc(100% - 27px); padding: 5px; text-align: left; cursor: pointer; }
.select > .ico { display: inline-block; vertical-align: top; width: 12px; padding: 5px 5px 5px 0; font-family: ico; cursor: pointer; }
.select > .list { position: absolute; top: 100%; left: -1px; width: max-content; min-width: 100%; max-height: 280px; border: 1px solid var(--dark); background-color: var(--white); z-index: 990; display: none; }
.select > .list > .option { padding: 5px 10px 5px 5px; text-align: left; cursor: pointer; }
.select > .list > .option:hover { color: var(--white); background-color: var(--dark); }

.checkbox { display: inline-block; vertical-align: top; border: 1px solid var(--dark); position: relative; }
.checkbox > .label { position: absolute; top: -15px; left: 5px; font-size: 10px; line-height: 12px; }
.checkbox > .option { display: inline-block; vertical-align: top; padding: 5px; }
.checkbox > .option > .txt { display: inline-block; vertical-align: top; padding: 0 0 0 5px; cursor: pointer; }
.checkbox > .option > .check { display: inline-block; vertical-align: top; width: 16px; height: 16px; border: 1px solid var(--dark); position: relative; cursor: pointer; }
.checkbox > .option.on > .check::after { position: absolute; top: 2px; left: 2px; right: 2px; bottom: 2px; background-color: var(--dark); content: ""; }

.btn { display: inline-block; vertical-align: top; border: 1px solid var(--dark); text-align: center; position: relative; }
.btn > a { color: var(--dark); text-decoration: none; }
.btn > a > div { padding: 5px 10px; }
.btn > a > div > .ico { display: inline-block; vertical-align: top; width: 12px; font-family: ico; }
.btn > a > div > .txt { display: inline-block; vertical-align: top; padding: 0 0 0 5px; }
.btn.min > a > div { padding: 5px; }
.btn.min > a > div > .ico { width: 18px; }
.btn.min > a > div > .txt { padding: 0 5px; }
.btn.fixed { height: 28px; }
.btn.fixed > a { position: absolute; top: 0; left: 0; right: 0; bottom: 0; }
.btn:hover { background-color: var(--dark); }
.btn:hover > a { color: var(--white); }