@charset "UTF-8";
html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

body {
  margin: 0;
}

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

hr {
  box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
}

pre {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

a {
  background-color: transparent;
}

abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: underline; /* 2 */
  text-decoration: underline dotted; /* 2 */
}

b,
strong {
  font-weight: bolder;
}

code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

small {
  font-size: 80%;
}

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

img {
  border-style: none;
}

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}

button,
input { /* 1 */
  overflow: visible;
}

button,
select { /* 1 */
  text-transform: none;
}

button,
[type=button],
[type=reset],
[type=submit] {
  -webkit-appearance: button;
}

button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

button:-moz-focusring,
[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

fieldset {
  padding: 0.35em 0.75em 0.625em;
}

legend {
  box-sizing: border-box; /* 1 */
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}

progress {
  vertical-align: baseline;
}

textarea {
  overflow: auto;
}

[type=checkbox],
[type=radio] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
  height: auto;
}

[type=search] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

details {
  display: block;
}

summary {
  display: list-item;
}

template {
  display: none;
}

[hidden] {
  display: none;
}

html, body {
  background-color: #1d2021;
}

* {
  color: #aaa;
}

.light {
  color: #8e8e8f;
}

.subdued {
  color: #777;
}

.faded {
  color: #777;
}

.faint {
  color: #4a4c4c;
}

.vfaint {
  color: #2f3132;
}

.secondary, .pink, .copper {
  color: #b06088;
}

.tertiary, .blue {
  color: #2c5d9e;
}

.error {
  color: #b06088;
}

::selection {
  background: #40608a;
  color: #aaa;
}

::-moz-selection {
  background: #40608a;
  color: #aaa;
}

:-webkit-autofill,
:-webkit-autofill:hover,
:-webkit-autofill:focus {
  border: 1px solid #b06088;
  -webkit-box-shadow: 0 0 0 30px #171a1a inset;
  -webkit-text-fill-color: #40608a !important;
}

@font-face {
  font-family: "Lascas";
  src: url("/_werc/pub/fonts/Lascas-Regular.otf");
}
@font-face {
  font-family: "Lascas";
  src: url("/_werc/pub/fonts/Lascas-Italic.otf");
  font-style: italic;
}
html,
body {
  height: 100%;
  width: 100%;
  margin: 0;
  padding: 0;
  left: 0;
  top: 0;
  font-size: 100%;
}

* {
  font-family: "Lascas", "Helvetica Neue", Helvetica, Arial, sans-serif;
  line-height: 1.5;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 400;
  font-style: normal;
}

h1 {
  font-size: 2.5rem;
}

h2 {
  font-size: 2rem;
}

h3 {
  font-size: 1.375rem;
}

h4 {
  font-size: 1.125rem;
}

h5 {
  font-size: 1rem;
}

h6 {
  font-size: 0.875rem;
}

p {
  font-size: 1rem;
  font-weight: 200;
  line-height: 1.6;
}

.font-regular {
  font-weight: 400;
}

.font-heavy {
  font-weight: 700;
}

.left {
  text-align: left;
}

.right {
  text-align: right;
}

.center {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

.centerdiv {
  margin-left: auto;
  margin-right: auto;
}

.justify {
  text-align: justify;
}

.hidden-sm, .hidden-lg {
  display: none;
}

.container {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (min-width: 33.75em) {
  .container {
    width: 85%;
  }
}
@media only screen and (min-width: 60em) {
  .container {
    width: 80%;
    max-width: 60rem;
  }
}

.row {
  position: relative;
  width: 100%;
}

.row > .col,
.row > [class^=col-] {
  float: left;
  margin: 0.5rem 2%;
  min-height: 0.125rem;
}

.row::after {
  content: "";
  display: table;
  clear: both;
}

.col-1,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9,
.col-10,
.col-11,
.col-12 {
  width: 96%;
}

.col-1-sm {
  width: 4.3333333333%;
}

.col-2-sm {
  width: 12.6666666667%;
}

.col-3-sm {
  width: 21%;
}

.col-4-sm {
  width: 29.3333333333%;
}

.col-5-sm {
  width: 37.6666666667%;
}

.col-6-sm {
  width: 46%;
}

.col-7-sm {
  width: 54.3333333333%;
}

.col-8-sm {
  width: 62.6666666667%;
}

.col-9-sm {
  width: 71%;
}

.col-10-sm {
  width: 79.3333333333%;
}

.col-11-sm {
  width: 87.6666666667%;
}

.col-12-sm {
  width: 96%;
}

@media only screen and (min-width: 45em) {
  .col-1 {
    width: 4.3333333333%;
  }
  .col-2 {
    width: 12.6666666667%;
  }
  .col-3 {
    width: 21%;
  }
  .col-4 {
    width: 29.3333333333%;
  }
  .col-5 {
    width: 37.6666666667%;
  }
  .col-6 {
    width: 46%;
  }
  .col-7 {
    width: 54.3333333333%;
  }
  .col-8 {
    width: 62.6666666667%;
  }
  .col-9 {
    width: 71%;
  }
  .col-10 {
    width: 79.3333333333%;
  }
  .col-11 {
    width: 87.6666666667%;
  }
  .col-12 {
    width: 96%;
  }
  .hidden-sm {
    display: block;
  }
}
@media only screen and (max-width: 60em) {
  .hidden-lg {
    display: block;
  }
}
@font-face {
  font-family: "icons";
  src: url("/_werc/pub/fonts/icons.eot?64603795");
  src: url("/_werc/pub/fonts/icons.eot?64603795#iefix") format("embedded-opentype"), url("/_werc/pub/fonts/icons.woff2?64603795") format("woff2"), url("/_werc/pub/fonts/icons.woff?64603795") format("woff"), url("/_werc/pub/fonts/icons.ttf?64603795") format("truetype"), url("/_werc/pub/fonts/icons.svg?64603795#icons") format("svg");
  font-weight: normal;
  font-style: normal;
}
/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */
/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */
/*
@media screen and (-webkit-min-device-pixel-ratio:0) {
  @font-face {
    font-family: 'icons';
    src: url('/_werc/pub/fonts/icons.svg?64603795#icons') format('svg');
  }
}
*/
[class^=icon-]:before, [class*=" icon-"]:before {
  font-family: "icons";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  margin-right: 0.2em;
  text-align: center;
  /* opacity: .8; */
  /* For safety - reset parent styles, that can break glyph codes*/
  font-variant: normal;
  text-transform: none;
  /* fix buttons height, for twitter bootstrap */
  line-height: 1em;
  /* Animation center compensation - margins should be symmetric */
  /* remove if not needed */
  margin-left: 0.2em;
  /* you can be more comfortable with increased icons size */
  /* font-size: 120%; */
  /* Font smoothing. That was taken from TWBS */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  /* Uncomment for 3D effect */
  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}

.icon-trash-empty:before {
  content: "\e800";
} /* '' */
.icon-home:before {
  content: "\e801";
} /* '' */
.icon-info-circled:before {
  content: "\e802";
} /* '' */
.icon-mail:before {
  content: "\e803";
} /* '' */
.icon-cancel:before {
  content: "\e804";
} /* '' */
.icon-search:before {
  content: "\e805";
} /* '' */
.icon-user:before {
  content: "\e806";
} /* '' */
.icon-location:before {
  content: "\e807";
} /* '' */
.icon-credit-card:before {
  content: "\e808";
} /* '' */
.icon-goodreads:before {
  content: "\e809";
} /* '' */
.icon-venmo:before {
  content: "\e80a";
} /* '' */
.icon-cash:before {
  content: "\e80b";
} /* '' */
.icon-archive:before {
  content: "\e80c";
} /* '' */
.icon-cog:before {
  content: "\e80d";
} /* '' */
.icon-floppy:before {
  content: "\e80e";
} /* '' */
.icon-truck:before {
  content: "\e80f";
} /* '' */
.icon-gift:before {
  content: "\e810";
} /* '' */
.icon-plus-circled:before {
  content: "\e811";
} /* '' */
.icon-plus:before {
  content: "\e812";
} /* '' */
.icon-facebook:before {
  content: "\f09a";
} /* '' */
.icon-menu:before {
  content: "\f0c9";
} /* '' */
.icon-mail-alt:before {
  content: "\f0e0";
} /* '' */
.icon-angle-left:before {
  content: "\f104";
} /* '' */
.icon-angle-right:before {
  content: "\f105";
} /* '' */
.icon-angle-up:before {
  content: "\f106";
} /* '' */
.icon-angle-down:before {
  content: "\f107";
} /* '' */
.icon-spinner:before {
  content: "\f110";
} /* '' */
.icon-info:before {
  content: "\f129";
} /* '' */
.icon-dollar:before {
  content: "\f155";
} /* '' */
.icon-bitcoin:before {
  content: "\f15a";
} /* '' */
.icon-instagram:before {
  content: "\f16d";
} /* '' */
.icon-paypal:before {
  content: "\f1ed";
} /* '' */
.icon-cc-paypal:before {
  content: "\f1f4";
} /* '' */
.icon-trash:before {
  content: "\f1f8";
} /* '' */
.icon-credit-card-alt:before {
  content: "\f283";
} /* '' */
.icon-shopping-bag:before {
  content: "\f290";
} /* '' */
.icon-comment:before {
  content: "\f4ac";
} /* '' */
.icon-bag:before {
  content: "\f290";
} /* '' */
.icon-shipped:before {
  content: "\e803";
} /* '' */
.icon-paid:before {
  content: "\f155";
} /* '' */
.img-index img {
  max-width: 90%;
  max-height: 90vh;
  display: block;
  margin-right: auto;
  margin-left: auto;
  position: relative;
  opacity: 0.9;
  transition: 0.3s ease;
  cursor: pointer;
}

.img-index img:hover {
  transform: scale(1.02, 1.02);
  opacity: 1;
}

p.caption {
  text-align: center;
  font-size: 0.95rem;
  line-height: 1.2;
}

@media only screen and (min-width: 45em) {
  #product_text {
    border-left: 1px solid #4a4c4c;
    box-sizing: border-box;
    padding-left: 1rem;
    margin-left: 0;
  }
}
@media only screen and (max-width: 45em) {
  #product_text {
    border-left: none;
  }
}

#product_img {
  border: none;
}
@media only screen and (min-width: 45em) {
  #product_img {
    padding-right: 1rem;
    margin-right: 0;
  }
}

#product_img img {
  float: right;
  max-width: 40vw;
}
@media only screen and (max-width: 33.75em) {
  #product_img img {
    float: none;
    max-width: 80vw;
    display: block;
    margin-left: auto;
    margin-right: auto;
    padding-right: inherit;
  }
}

#product_title {
  color: #aaa;
  font-size: 1.25rem;
}

#product_price {
  color: #777;
  font-size: 0.95rem;
}

#product_price::before {
  content: "$";
  font-size: 0.791635rem;
}

.price::before,
.price::after {
  font-size: 0.8333rem;
}

.price.small::before,
.price.small::after {
  font-size: 0.791635rem;
}

.price::before {
  content: "$";
}

.price[data-currency=mbtc]::before {
  content: "";
}

.price[data-currency=mbtc]::after {
  content: " mBTC";
}

#product_author,
#product_description * {
  font-size: 0.95rem;
}

#product_description * {
  color: #777;
}

#product_author {
  color: #aaa;
}

#product_specs {
  margin-bottom: 2rem;
}
#product_specs p {
  color: #777;
  font-size: 0.95rem;
  line-height: 1.4;
  margin-block-start: 0.25em;
  margin-block-end: 0.25em;
}

#putinbagbtn {
  transition: background-color 300ms ease-in-out;
}

#product_bagbtn {
  min-width: 100%;
  margin-top: 1rem;
}

#viewbagbtn {
  display: none;
}

#bag p,
#bag span,
#bag input.plain,
#bag input[type=number] {
  color: #aaa;
  font-size: 0.95rem;
}

#bag a {
  color: #987888;
  font-size: 0.95rem;
}

#bag p.small,
#bag input.small,
#bag input.plain.small {
  font-size: 0.95rem;
}

#orders, #orders p, #orders a, #orders span,
#orders input, #orders button {
  font-size: 0.95rem;
}

#bag p, #orders p {
  margin: 0;
}

#bag input[type=number] {
  background-color: #1d2021;
  border-color: #b06088;
  border-width: 0 0 1px 0;
  border-radius: 0;
  padding-bottom: 2px;
  text-align: center;
}

#bag button.plain,
#bag input[type=submit] {
  border: none;
}

/* hide number spinners in webkit browsers */
#bag input[type=number]::-webkit-inner-spin-button,
#bag input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* hide number spinners in firefox, etc */
#bag input[type=number] {
  -moz-appearance: textfield;
}

.bag-row, .bag-head {
  border-bottom: 1px solid #4a4c4c;
}

.bag-row .bag-col {
  padding: 1rem 0;
}

.bag-row p {
  line-height: 1.3;
  padding-top: 0.25rem;
}

#order-summary {
  padding: 0.5rem;
  top: 0px;
  table-layout: fixed;
  border-collapse: collapse;
  border: 1px solid #4a4c4c;
  /* TODO: for item names in bag summary, use nowrap, overflow hidden, and text-overflow ellipsis */
}
#order-summary tbody {
  border-bottom: 1px solid #4a4c4c;
}
#order-summary th, #order-summary td {
  padding: 6px 10px;
  border: 1px solid #4a4c4c;
}

.summary-row p {
  line-height: 1.3;
  padding-top: 0.25rem;
}

#checkout textarea,
#checkout select,
#checkout input {
  box-sizing: border-box;
  border: 1px solid #4a4c4c;
  border-radius: 0.3rem;
  padding: 0.5rem;
  margin: 0.25rem 0;
}

#checkout #address input,
#checkout #address select {
  width: 100%;
  max-width: 20em;
}

/* replace dropdown arrow */
.selectdiv {
  position: relative;
}

.selectdiv:after {
  content: "\f107";
  font: normal normal normal 1rem/1 icons;
  right: 0.5rem;
  top: -3px;
  height: 1rem;
  padding: 1rem 0.25rem 0px 0.25rem;
  position: absolute;
  pointer-events: none;
}

.selectdiv select::-ms-expand {
  display: none;
}

.selectdiv select {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
}

#checkout textarea:focus,
#checkout input:focus {
  box-sizing: border-box;
}
#checkout input.valid {
  border-left: 2px solid #79740e;
}
#checkout input.error {
  border-left: 2px solid #b06088;
}

#bag-foot {
  display: none;
}

.remove i {
  fill: #b06088;
  color: #b06088;
}

.tracking-form input[type=text] {
  width: 80%;
}

.tracking-form input[type=submit] {
  width: 20%;
}

.aligner {
  display: flex;
  align-items: center;
  justify-content: center;
}

.aligner-item {
  max-width: 50%;
}

.flex-table-row {
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-around;
  align-items: center;
  align-content: center;
}

.flex-row {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between; /* gutters between columns */
  align-items: center;
  align-content: center;
}

.flex-col {
  flex: 1;
  margin: 0.5rem 2%;
}

.flex-row .col-1 {
  width: 8%;
}

.flex-row .col-2 {
  width: 16%;
}

.flex-row .col-3 {
  width: 24%;
}

.flex-row .col-4 {
  width: 32%;
}

.flex-row .col-5 {
  width: 41%;
}

.flex-row .col-6 {
  width: 49%;
}

.flex-row .col-7 {
  width: 58%;
}

.flex-row .col-8 {
  width: 66%;
}

.flex-row .col-9 {
  width: 74%;
}

.flex-row .col-10 {
  width: 83%;
}

.flex-row .col-11 {
  width: 91%;
}

.flex-row .col-12 {
  width: 99%;
}

.grid,
.grid-wrap {
  display: flex;
  justify-content: space-between;
}

@media (max-width: 24em) {
  .grid-wrap {
    display: block;
  }
  .grid-wrap .grid-cell {
    width: 100%;
    margin: 0 0 10px 0;
  }
}
.grid .grid-cell,
.grid-wrap .grid-cell {
  flex: 1;
  padding: 20px;
}

table.dashboard-table {
  table-layout: fixed;
  width: 100%;
}
table.dashboard-table tbody {
  border-bottom: 1px solid #4a4c4c;
}
table.dashboard-table td {
  max-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

span.ordernum {
  width: 5em;
  min-width: 5em;
  margin-right: 0.5em;
  text-align: center;
  font-size: 0.95rem;
  font-weight: 700;
}

.orders a,
.orders p,
.orders time,
.orders span {
  font-size: 0.95rem;
}

#order-summary {
  font-size: 0.95rem;
  line-height: 0.95rem;
}

#items-body,
#items-head {
  float: none;
  margin: 0;
}

input.inline-city {
  max-width: 50%;
}

input.inline-state {
  max-width: 20%;
}

input.inline-zip {
  max-width: 20%;
}

.btn.small, a.btn.small, #body-main a.btn.small {
  padding: 2px 5px;
}

/*
   Animation example, for spinners
*/
.animate-spin {
  -moz-animation: spin 2s infinite linear;
  -o-animation: spin 2s infinite linear;
  -webkit-animation: spin 2s infinite linear;
  animation: spin 2s infinite linear;
  display: inline-block;
}

@-moz-keyframes spin {
  0% {
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -moz-transform: rotate(359deg);
    -o-transform: rotate(359deg);
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@-webkit-keyframes spin {
  0% {
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -moz-transform: rotate(359deg);
    -o-transform: rotate(359deg);
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@-o-keyframes spin {
  0% {
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -moz-transform: rotate(359deg);
    -o-transform: rotate(359deg);
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@-ms-keyframes spin {
  0% {
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -moz-transform: rotate(359deg);
    -o-transform: rotate(359deg);
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@keyframes spin {
  0% {
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -moz-transform: rotate(359deg);
    -o-transform: rotate(359deg);
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
html {
  scroll-behavior: auto;
}

p {
  font-size: 1rem;
}

body {
  font-size: 1rem;
  font-variant-numeric: proportional-nums oldstyle-nums diagonal-fractions;
  -moz-font-feature-settings: "pnum", "onum", "frac";
  -webkit-font-feature-settings: "pnum", "onum", "frac";
  font-feature-settings: "pnum", "onum", "frac";
}

input, textarea {
  background-color: #1d2021;
  color: #aaa;
  box-sizing: border-box;
  border: 2px solid #2f3132;
  border-radius: 0.3rem;
  padding: 0.5rem;
  margin: 0.25rem 0;
}

input:focus, textarea:focus,
input.valid:focus, input.error:focus {
  box-sizing: border-box;
  background-color: #171a1a;
  border: 2px solid #c84888;
}

em {
  font-style: italic;
}

b, strong {
  font-weight: bold;
}

blockquote {
  border: none;
}

.address {
  margin-left: 2rem;
  line-height: 1.1;
}

table, tbody, tr, td {
  border: none;
  background: none;
}

td {
  padding: 5px 0px;
}

.dashboard-table tr, .dashboard-table td, .dashboard-table th {
  border-bottom: 1px solid #4a4c4c;
  border-collapse: collapse;
}

h1 {
  font-size: 1.5rem;
}

h2 {
  font-size: 1.25rem;
}

h3 {
  font-size: 1.2rem;
}

hr {
  padding: 1rem 0;
  margin: 1rem 0;
  height: 0px;
  border-top: 1px solid #2f3132;
  border-bottom: none;
  border-left: none;
  border-right: none;
  width: 90%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.toupper {
  text-transform: uppercase;
}

.tolower {
  text-transform: lowercase;
}

.italic {
  font-style: italic;
}

h1 .uline {
  border-bottom: 2px solid #2f3132;
}

.huge {
  font-size: 1.5rem;
}

.vlarge {
  font-size: 1.25rem;
}

.large {
  font-size: 1.1rem;
}

.smallish {
  font-size: 0.95rem;
}

.small {
  font-size: 0.95rem;
}

.vsmall {
  font-size: 0.85rem;
}

h1.indent {
  text-indent: 1em;
}

.indent {
  text-indent: 10%;
}

.bigindent {
  text-indent: 20%;
}

.hidden {
  display: none;
}

.centerdiv {
  max-width: 100%;
  margin: 0 auto;
}

span.badge {
  min-width: 3rem;
  padding: 0 6px;
  margin-left: 14px;
  text-align: center;
  font-size: 0.85rem;
  line-height: 22px;
  height: 22px;
  box-sizing: border-box;
  background-color: #987888;
  color: #ccc;
  font-variant: small-caps;
}

.right {
  float: right;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

ul {
  list-style: none;
}

#body-main li::before {
  content: "•";
  color: #b06088;
  display: inline-block;
  width: 0.7em;
  margin-left: -0.7em;
}

button, .btn {
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

input[type=submit].link {
  line-height: 1.5;
  padding: 0;
  border: 0;
  margin: 0 10px;
}

.link {
  color: #b06088;
  text-decoration: underline;
}

a, a:visited, a:active {
  color: #aaa;
  text-decoration: none;
  background-color: transparent;
}

a:hover,
a:hover * {
  text-decoration: none;
  border: none;
}

#body-main a:hover,
#body-main a:hover * {
  color: #b06088;
  fill: #b06088;
}

a:focus, button:focus, input.btn:focus {
  outline: 0;
}

#body-main a, #body-main a:visited {
  border-bottom: 1px solid #987888;
}

#body-main h2 a, #body-main h2 a:visited {
  border: none;
}

#body-main a:focus, #body-main h2 a:focus {
  border-bottom: 2px dashed #c84888;
  color: #bbb;
}

#body-main {
  margin-top: 1rem;
  padding-bottom: 2rem;
}

.nav-fixed {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
}

.nav-center {
  text-align: center;
}

nav {
  padding: 1.5rem 0 0.75rem 0;
  margin: 0;
}
nav hr {
  padding: 0;
  margin: 0 auto;
}
nav #nav-logo {
  padding: 0.5rem 0 0 0;
}
nav .site-logo {
  fill: #aaa;
  height: 1.25rem;
}

footer {
  padding: 2rem 0;
  border-top: 2px dashed #2f3132;
  background-color: #1d2021;
  text-align: center;
}
footer p, footer a, footer label, footer input {
  font-size: 0.95rem;
}
footer a, footer a:visited, footer a:active,
footer p, footer span, footer ul, footer li, footer i,
footer input {
  color: #777;
  fill: #777;
}
footer a, footer a:visited, footer a:active {
  color: #777;
  border-bottom: 1px solid transparent;
}
footer a:focus,
footer a:focus *,
footer a:hover,
footer a:hover * {
  color: #b06088;
  fill: #b06088;
}
footer ::placeholder {
  color: #5c5d5d;
}
footer textarea:focus, footer input:focus, footer input.plain:focus {
  background-color: transparent;
  outline: 2px dashed #c84888;
  border: none;
}
footer .uline {
  border-bottom: 1px solid #2f3132;
}

a#nav-title {
  padding: 0 5px;
  line-height: 1rem;
  font-size: 1.75em;
  color: #aaa;
  border-radius: 0.3rem;
}

a#nav-title:focus {
  border: 2px dashed #c84888;
}

a#nav-title:focus:active,
a#nav-title:active {
  border: none;
}

#nav-subtitle {
  padding: 0 0 0.25rem 0;
  margin: 0;
  font-size: 0.95rem;
  font-style: italic;
  display: inline-block;
}
#nav-subtitle li {
  padding-left: 0.7em;
  display: inline-block;
  font-size: 0.95rem;
  font-style: italic;
}
#nav-subtitle li:before {
  content: "•";
  color: #b06088;
  display: inline-block;
  width: 0.7em;
  margin-left: -0.7em;
}
#nav-subtitle li:first-child:before {
  content: "";
  width: 0;
}

#nav-breadcrumbs ul li {
  display: inline;
  font-size: 0.95rem;
}
#nav-breadcrumbs ul li * {
  color: #b06088;
}
#nav-breadcrumbs ul {
  padding-inline-start: 0;
  margin-block-start: 0;
  margin-block-end: 0;
}
#nav-breadcrumbs a * {
  color: #b06088;
  fill: #b06088;
}
#nav-breadcrumbs a:focus *, #nav-breadcrumbs #nav-breadcrumbs a:hover * {
  color: #c84888;
  fill: #c84888;
}

input[type=submit] {
  border: none;
}

input[type=submit]:hover, button:hover {
  cursor: pointer;
  color: #aaa;
}

button,
a.btn {
  white-space: nowrap;
}

button,
.btn, a.btn, input.btn,
#body-main input.btn, #body-main a.btn,
#body-main input.btn:visited {
  box-sizing: border-box;
  border: 2px solid transparent;
  border-radius: 0.3rem;
  background-color: #40608a;
  color: #ccc;
  cursor: pointer;
  transition: background-color 300ms, color 300ms;
}

.btn > span {
  color: #ccc;
}

.btn-icon {
  padding-left: 5px;
}

button:hover, button:focus,
#body-main a.btn:hover, #body-main input.btn:hover,
#body-main a.btn:focus, #body-main input.btn:focus,
.btn:hover, a.btn:hover, input.btn:hover, a.btn:visited:hover,
.btn:focus, a.btn:focus, input.btn:focus, a.btn:visited:focus {
  background-color: #304867;
}

button:focus,
#body-main a.btn:focus, #body-main a.btn:visited:focus, #body-main input.btn:focus,
.btn:focus, a.btn:focus, input.btn:focus, a.btn:visited:focus {
  border: 2px dashed #c84888;
}

.btn, a.btn, input.btn,
#body-main input.btn, #body-main a.btn,
#body-main input.btn:visited {
  padding: 15px 30px;
}

img.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.margintop {
  margin-top: 2rem;
}

.marginbottom {
  margin-bottom: 2rem;
}

.bigmargintop {
  margin-top: 4rem;
}

.bigmarginbottom {
  margin-bottom: 4rem;
}

.smallmarginbottom {
  margin-bottom: 1rem;
}

.smallmargintop {
  margin-bottom: 1rem;
}

.vsmallmarginbottom {
  margin-bottom: 0.5rem;
}

.vsmallmargintop {
  margin-bottom: 0.5rem;
}

.tinymarginbottom {
  margin-bottom: 0.25rem;
}

.tinymargintop {
  margin-bottom: 0.25rem;
}

.nomarginbottom {
  margin-bottom: 0;
}

.nomargintop {
  margin-top: 0;
}

.paddingbottom {
  padding-bottom: 1rem;
}

.paddingtop {
  padding-top: 1rem;
}

.nopaddingbottom {
  padding-bottom: 0;
}

.nopaddingtop {
  padding-top: 0;
}

.col-unpadded {
  margin-left: 0;
  padding-left: 0;
}

.full-width {
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
}

.full-width-simple {
  width: 100%;
}

.alert {
  font-size: 0.95rem;
  color: #aaa;
  padding: 1rem;
  border-radius: 6px;
  background-color: #313334;
  border: 1px solid #4a4c4c;
}
.alert a, .alert a:visited, .alert a:active {
  color: #b06088;
  border-bottom: 1px solid #987888;
}
.alert a:hover {
  color: #c84888;
  fill: #c84888;
  border-bottom: 1px solid #b06088;
}

.alert-danger,
.alert-error {
  color: black;
  background-color: white;
  border-color: white;
}

form, fieldset {
  border: none;
}

input[type=checkbox] {
  appearance: none;
  -webkit-appearance: none;
  background-color: transparent;
  border: 2px solid #40608a;
  padding: 6px;
  display: inline-block;
  position: relative;
  box-sizing: border-box;
}

input[type=checkbox]:checked {
  appearance: none;
  -webkit-appearance: none;
  background-color: transparent;
}

input[type=checkbox]:checked:after {
  content: "✔";
  font-size: 1rem;
  font-weight: 800;
  position: absolute;
  top: -4px;
  left: 0px;
  color: #b06088;
}

input[type=checkbox]:hover {
  cursor: pointer;
}

textarea:focus,
input:focus {
  outline: none;
  border: 2px solid #2f3132;
  border-radius: 0.3rem;
  box-sizing: border-box;
  background-color: #171a1a;
  color: #aaa;
}

footer input:focus,
footer textarea:focus {
  border: none;
}

.form-group {
  margin: 1rem 0;
  padding: 1rem 0;
}

.col > .form-group,
.flex-col > .form-group {
  margin: 0;
  padding: 0;
}

.help-block {
  font-size: 0.95rem;
  color: #777;
  font-style: italic;
}

input[type=number] {
  width: 2rem;
}

textarea {
  resize: none;
}

.uline {
  border-bottom: 1px solid #4a4c4c;
}

.inline {
  display: inline;
}

form.inline {
  display: flex;
  flex-flow: row wrap;
  align-items: flex-start;
}

.plain {
  background: none;
  padding: 2px;
  -webkit-transition: none;
  transition: none;
}

input.plain {
  border: 0 none;
  border-radius: 0px;
}

button.plain,
input[type=submit] {
  border-radius: 0.3rem;
  padding: 2px 5px;
  border: 1px solid #4a4c4c;
}

button.plain:hover {
  background-color: #2f3132;
}

select {
  background: none;
  border: 1px solid #4a4c4c;
}

div.inline input {
  display: inline;
}

.radio-wrap {
  padding: 0.5rem;
  border: 1px solid transparent;
  border-radius: 4px;
}

.radio-wrap.focused {
  outline: 2px dashed #b06088;
}

.radio-wrap.selected {
  background-color: #171a1a;
  border: 1px solid #987888;
}

.radio-wrap.selected.focused {
  border: 1px solid transparent;
}

input[type=radio]:focus {
  outline: 0;
}

.dropdown-head {
  cursor: pointer;
}

.dropdown-body {
  display: none;
}

.borderbottom {
  border-bottom: 1px solid #4a4c4c;
}

.bordertop {
  border-top: 1px solid #4a4c4c;
}

.error {
  color: #b06088;
}

:disabled {
  background-color: #607085;
}

:disabled:hover {
  background-color: #607085;
}

.autocomplete-suggestions {
  border: 1px solid #4a4c4c;
  border-radius: 0.3rem;
  background: #1d2021;
  overflow: auto;
  padding: 0.25rem;
  margin: 0.25rem 0;
}

.autocomplete-suggestion {
  padding: 0.1rem;
  white-space: nowrap;
  overflow: hidden;
  box-sizing: content-box;
  cursor: pointer;
}

.autocomplete-suggestion:nth-child(1) {
  background: #1d2021;
}

.autocomplete-suggestion:nth-child(2) {
  background: #171a1a;
}

.autocomplete-selected {
  background: #5b2d44 !important;
}
.autocomplete-selected strong {
  color: #aaa !important;
  font-weight: 700 !important;
}

.autocomplete-suggestions strong {
  font-weight: normal;
  color: #b06088;
}

.autocomplete-group {
  padding: 2px 5px;
}

/*
.autocomplete-group strong { 
	display: block; 
	border-bottom: 1px solid $fg; 
}
*/
.tooltipsy {
  padding: 10px;
  max-width: 200px;
  color: #aaa;
  background-color: #1d2021;
  border: 1px solid #4a4c4c;
  font-size: 0.95rem;
}

#nav-home-wrap {
  position: relative;
  display: table;
  padding-top: 0.5rem;
}
#nav-home-wrap #nav-title > span {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}

ul.vertical-padding-2 > li {
  padding-top: 4px;
  padding-bottom: 4px;
}
