bullframe.css 3.8.1 → 4.0.1

package/dist/css/bullframe-dark-prefers.css

@@ -1,4 +1,4 @@
-/*! bullframe.css v3.8.0 | MIT License | https://github.com/marcop135/bullframe.css */
+/*! bullframe.css v4.0.1 | MIT License | https://github.com/marcop135/bullframe.css */
 /*! custom build: bullframe-dark-prefers */
 *,
 *::before,
@@ -26,26 +26,10 @@ template {
   display: none;
 }
 
-a,
-area,
-button,
-input,
-label,
-select,
-summary,
-textarea,
-[tabindex] {
-  -ms-touch-action: manipulation;
-}
-
 [hidden] {
   display: none !important;
 }
 
-@-ms-viewport {
-  width: device-width;
-}
-
 html {
   -webkit-text-size-adjust: 100%;
      -moz-text-size-adjust: 100%;
@@ -129,7 +113,7 @@ blockquote small {
 }
 
 blockquote small:before {
-  content: '\2014 \00A0';
+  content: "— ";
 }
 
 q {
@@ -139,19 +123,14 @@ q {
 pre {
   margin: 0 0 20px 0;
   margin: 0 0 2rem 0;
-}
-
-pre {
   display: block;
   overflow: auto;
   word-break: break-all;
   word-wrap: break-word;
   white-space: pre;
   -webkit-hyphens: none;
-      -ms-hyphens: none;
           hyphens: none;
   -ms-overflow-style: auto;
-  display: block;
 }
 
 pre,
@@ -159,7 +138,7 @@ code,
 kbd,
 samp {
   font-family: "Menlo", "Consolas", "Roboto Mono", "Ubuntu Monospace", "Noto Mono", "Oxygen Mono", "Liberation Mono", monospace, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
-  font-size: .875em;
+  font-size: 0.875em;
 }
 
 code {
@@ -187,7 +166,6 @@ abbr[data-original-title] {
   text-decoration: underline;
   -webkit-text-decoration: underline dotted;
           text-decoration: underline dotted;
-  cursor: help;
   border-bottom: 0;
 }
 
@@ -207,6 +185,7 @@ strong {
   font-weight: inherit;
 }
 
+/* stylelint-disable-next-line */
 b,
 strong {
   font-weight: bolder;
@@ -226,12 +205,12 @@ sup {
 
 sup {
   top: -8px;
-  top: -.8rem;
+  top: -0.8rem;
 }
 
 sub {
   bottom: -4px;
-  bottom: -.4rem;
+  bottom: -0.4rem;
 }
 
 small {
@@ -268,7 +247,6 @@ a {
   text-decoration: none;
   background-color: transparent;
 }
-
 a:hover, a:focus {
   text-decoration: underline;
   color: #0056b3;
@@ -295,7 +273,7 @@ a:not([href]):not([tabindex]):focus {
   outline: none;
 }
 
-[tabindex='-1']:focus:not(:focus-visible) {
+[tabindex="-1"]:focus:not(:focus-visible) {
   outline: 0 !important;
 }
 
@@ -309,24 +287,23 @@ input:focus {
 }
 
 button:focus,
-[type='button']:focus,
-[type='reset']:focus,
-[type='submit']:focus,
-[type='email']:focus,
-[type='number']:focus,
-[type='password']:focus,
-[type='tel']:focus,
-[type='search']:focus,
-[type='text']:focus,
-[type='date']:focus,
-[type='datetime-local']:focus,
-[type='month']:focus,
-[type='time']:focus,
-[type='week']:focus,
-[type='time']:focus,
-[type='url']:focus,
-[type='radio']:focus,
-[type='checkbox']:focus,
+[type=button]:focus,
+[type=reset]:focus,
+[type=submit]:focus,
+[type=email]:focus,
+[type=number]:focus,
+[type=password]:focus,
+[type=tel]:focus,
+[type=search]:focus,
+[type=text]:focus,
+[type=date]:focus,
+[type=datetime-local]:focus,
+[type=month]:focus,
+[type=time]:focus,
+[type=week]:focus,
+[type=url]:focus,
+[type=radio]:focus,
+[type=checkbox]:focus,
 input[list]:focus,
 select:focus,
 textarea:focus {
@@ -374,7 +351,7 @@ dd {
 }
 
 nav li:before {
-  content: '\200B';
+  content: "​";
   position: absolute;
 }
 
@@ -487,8 +464,8 @@ textarea {
 
 html input,
 button,
-[type='radio'],
-[type='checkbox'],
+[type=radio],
+[type=checkbox],
 select,
 optgroup,
 textarea {
@@ -504,12 +481,12 @@ legend {
 
 html label,
 button,
-[type='image'],
-[type='submit'],
-[type='reset'],
-html [type='button'],
-[type='radio'],
-[type='checkbox'] {
+[type=image],
+[type=submit],
+[type=reset],
+html [type=button],
+[type=radio],
+[type=checkbox] {
   width: auto;
 }
 
@@ -518,14 +495,14 @@ label,
 select,
 textarea,
 button,
-html [type='button'],
-[type='reset'],
-[type='submit'],
+html [type=button],
+[type=reset],
+[type=submit],
 output {
   display: inline-block;
 }
 
-[type='file'] {
+[type=file] {
   display: block;
   background-color: transparent;
 }
@@ -582,8 +559,8 @@ label textarea {
   font-size: 110%;
 }
 
-[type='number']::-webkit-outer-spin-button,
-[type='number']::-webkit-inner-spin-button {
+[type=number]::-webkit-outer-spin-button,
+[type=number]::-webkit-inner-spin-button {
   height: auto;
 }
 
@@ -601,7 +578,7 @@ label textarea {
   padding: 0;
 }
 
-[type='search'] {
+[type=search] {
   outline-offset: -2.5px;
   outline-offset: -0.25rem;
 }
@@ -619,8 +596,8 @@ select {
   word-wrap: normal;
 }
 
-[list]::-webkit-calendar-picker-indicator {
-  display: none;
+[list]:not([type=date]):not([type=datetime-local]):not([type=month]):not([type=week]):not([type=time])::-webkit-calendar-picker-indicator {
+  display: none !important;
 }
 
 optgroup {
@@ -632,23 +609,23 @@ optgroup {
 }
 
 button,
-html [type="button"],
-[type="reset"],
-[type="submit"],
-[type="email"],
-[type="number"],
-[type="text"],
-[type="tel"],
-[type="date"],
-[type="datetime-local"],
-[type="month"],
-[type="week"],
-[type="url"],
-[type="image"],
-[type="password"],
-[type="search"],
-[type="search"]::-webkit-search-decoration,
-[type="search"]::-webkit-search-cancel-button,
+html [type=button],
+[type=reset],
+[type=submit],
+[type=email],
+[type=number],
+[type=text],
+[type=tel],
+[type=date],
+[type=datetime-local],
+[type=month],
+[type=week],
+[type=url],
+[type=image],
+[type=password],
+[type=search],
+[type=search]::-webkit-search-decoration,
+[type=search]::-webkit-search-cancel-button,
 input[list],
 textarea {
   -webkit-appearance: none;
@@ -667,22 +644,22 @@ textarea {
   border-radius: 0.25rem;
 }
 
-[type='radio'] {
+[type=radio] {
   border-radius: 50%;
 }
 
-[type='checkbox'] {
+[type=checkbox] {
   border-radius: 5px;
   border-radius: 0.5rem;
 }
 
-[type='radio'],
-[type='checkbox'] {
+[type=radio],
+[type=checkbox] {
   padding: 0;
   background-color: #fff;
 }
 
-[type='range'] {
+[type=range] {
   background-color: transparent;
 }
 
@@ -710,9 +687,9 @@ textarea {
 }
 
 button,
-[type='button'],
-[type='reset'],
-[type='submit'] {
+[type=button],
+[type=reset],
+[type=submit] {
   line-height: normal;
   text-align: center;
   margin: 0;
@@ -722,34 +699,32 @@ button,
   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   border: 0;
   background-image: none;
 }
-
 button:hover, button:active, button:focus,
-[type='button']:hover,
-[type='button']:active,
-[type='button']:focus,
-[type='reset']:hover,
-[type='reset']:active,
-[type='reset']:focus,
-[type='submit']:hover,
-[type='submit']:active,
-[type='submit']:focus {
+[type=button]:hover,
+[type=button]:active,
+[type=button]:focus,
+[type=reset]:hover,
+[type=reset]:active,
+[type=reset]:focus,
+[type=submit]:hover,
+[type=submit]:active,
+[type=submit]:focus {
   text-decoration: none;
   color: #222;
 }
 
 button,
 select,
-input[type='submit'],
-input[type='button'],
-[type='checkbox'],
-[type='range'],
-[type='radio'],
-[role='button'] {
+input[type=submit],
+input[type=button],
+[type=checkbox],
+[type=range],
+[type=radio],
+[role=button] {
   cursor: pointer;
 }
 
@@ -761,10 +736,6 @@ input::-moz-placeholder, textarea::-moz-placeholder {
   color: #666;
 }
 
-input:-ms-input-placeholder, textarea:-ms-input-placeholder {
-  color: #666;
-}
-
 input::placeholder,
 textarea::placeholder {
   color: #666;
@@ -774,19 +745,18 @@ textarea::placeholder {
   box-shadow: none;
 }
 
-[type='email'],
-[type='number'],
-[type='password'],
-[type='tel'],
-[type='search'],
-[type='text'],
-[type='date'],
-[type='datetime-local'],
-[type='month'],
-[type='time'],
-[type='week'],
-[type='time'],
-[type='url'],
+[type=email],
+[type=number],
+[type=password],
+[type=tel],
+[type=search],
+[type=text],
+[type=date],
+[type=datetime-local],
+[type=month],
+[type=week],
+[type=time],
+[type=url],
 input[list],
 select,
 textarea {
@@ -796,79 +766,75 @@ textarea {
   padding: 0.5rem 0.75rem;
 }
 
-[type='email']:active, [type='email']:focus,
-[type='number']:active,
-[type='number']:focus,
-[type='password']:active,
-[type='password']:focus,
-[type='tel']:active,
-[type='tel']:focus,
-[type='search']:active,
-[type='search']:focus,
-[type='text']:active,
-[type='text']:focus,
-[type='date']:active,
-[type='date']:focus,
-[type='datetime-local']:active,
-[type='datetime-local']:focus,
-[type='month']:active,
-[type='month']:focus,
-[type='time']:active,
-[type='time']:focus,
-[type='week']:active,
-[type='week']:focus,
-[type='time']:active,
-[type='time']:focus,
-[type='url']:active,
-[type='url']:focus,
+[type=email]:active, [type=email]:focus,
+[type=number]:active,
+[type=number]:focus,
+[type=password]:active,
+[type=password]:focus,
+[type=tel]:active,
+[type=tel]:focus,
+[type=search]:active,
+[type=search]:focus,
+[type=text]:active,
+[type=text]:focus,
+[type=date]:active,
+[type=date]:focus,
+[type=datetime-local]:active,
+[type=datetime-local]:focus,
+[type=month]:active,
+[type=month]:focus,
+[type=week]:active,
+[type=week]:focus,
+[type=time]:active,
+[type=time]:focus,
+[type=url]:active,
+[type=url]:focus,
 input[list]:active,
 input[list]:focus,
 select:active,
 select:focus,
 textarea:active,
 textarea:focus,
-[type='radio']:active,
-[type='radio']:focus,
-[type='checkbox']:active,
-[type='checkbox']:focus {
-  transition: border .2s, background-color .2s, box-shadow .2s;
+[type=radio]:active,
+[type=radio]:focus,
+[type=checkbox]:active,
+[type=checkbox]:focus {
+  transition: border 0.2s, background-color 0.2s, box-shadow 0.2s;
   border-color: #007bff;
   box-shadow: 0 0 0 3px rgba(0, 86, 179, 0.25);
 }
 
 button,
-[type='button'],
-[type='reset'],
-[type='submit'] {
+[type=button],
+[type=reset],
+[type=submit] {
   color: #222;
-  padding: 6.66667px 13.33333px;
-  padding: 0.66667rem 1.33333rem;
+  padding: 6.6666666667px 13.3333333333px;
+  padding: 0.6666666667rem 1.3333333333rem;
   background: #ccc;
-  transition: color .2s, background .2s, box-shadow .2s;
+  transition: color 0.2s, background 0.2s, box-shadow 0.2s;
 }
-
 button:hover, button:active, button:focus,
-[type='button']:hover,
-[type='button']:active,
-[type='button']:focus,
-[type='reset']:hover,
-[type='reset']:active,
-[type='reset']:focus,
-[type='submit']:hover,
-[type='submit']:active,
-[type='submit']:focus {
+[type=button]:hover,
+[type=button]:active,
+[type=button]:focus,
+[type=reset]:hover,
+[type=reset]:active,
+[type=reset]:focus,
+[type=submit]:hover,
+[type=submit]:active,
+[type=submit]:focus {
   text-decoration: none;
   color: #222;
   background: #b3b3b3;
 }
-
 button:active, button:focus,
-[type='button']:active,
-[type='button']:focus,
-[type='reset']:active,
-[type='reset']:focus,
-[type='submit']:active,
-[type='submit']:focus {
+[type=button]:active,
+[type=button]:focus,
+[type=reset]:active,
+[type=reset]:focus,
+[type=submit]:active,
+[type=submit]:focus {
   box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.15);
 }
 
@@ -896,112 +862,49 @@ input:disabled:checked,
 select:disabled,
 textarea:disabled,
 label:disabled,
-button[aria-disabled="true"],
-input[aria-disabled="true"],
-input[aria-disabled="true"]:after,
-input[aria-disabled="true"]:before,
-input[aria-disabled="true"]:checked,
-select[aria-disabled="true"],
-textarea[aria-disabled="true"],
-label[aria-disabled="true"] {
+button[aria-disabled=true],
+input[aria-disabled=true],
+input[aria-disabled=true]:after,
+input[aria-disabled=true]:before,
+input[aria-disabled=true]:checked,
+select[aria-disabled=true],
+textarea[aria-disabled=true],
+label[aria-disabled=true] {
   cursor: default !important;
   cursor: not-allowed !important;
   pointer-events: none !important;
   -webkit-user-select: none !important;
      -moz-user-select: none !important;
-      -ms-user-select: none !important;
           user-select: none !important;
   box-shadow: none !important;
-  opacity: .5 !important;
-}
-
-@media \0screen {
-  [type='email'],
-  [type='number'],
-  [type='password'],
-  [type='tel'],
-  [type='search'],
-  [type='text'],
-  [type='date'],
-  [type='datetime-local'],
-  [type='month'],
-  [type='time'],
-  [type='week'],
-  [type='time'],
-  [type='url'],
-  [type='range'],
-  input[list] {
-    padding-top: 0;
-    padding-bottom: 0;
-    height: 32px;
-    line-height: 32px;
-  }
-}
-
-@media screen and (min-width: 0\0) and (-webkit-min-device-pixel-ratio: 0.75), screen and (min-width: 0\0) and (min-resolution: 72dpi) {
-  [type='email'],
-  [type='number'],
-  [type='password'],
-  [type='tel'],
-  [type='search'],
-  [type='text'],
-  [type='date'],
-  [type='datetime-local'],
-  [type='month'],
-  [type='time'],
-  [type='week'],
-  [type='time'],
-  [type='url'],
-  [type='range'],
-  input[list] {
-    line-height: 1.2;
-  }
+  opacity: 0.5 !important;
 }
 
 select:not([size]):not([multiple]) {
   -webkit-appearance: none;
      -moz-appearance: none;
           appearance: none;
+  background: #fff url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") no-repeat right 0.85rem center/8px 10px;
+  padding-right: 20px;
+  padding-right: 2rem;
 }
 
 select::-ms-expand {
   display: none;
 }
 
-select:not([size]):not([multiple]) {
-  background: #fff url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") no-repeat right 0.85rem center/8px 10px;
-  padding-right: 20px;
-  padding-right: 2rem;
-}
-
-*[dir='rtl'] select:not([size]):not([multiple]),
-select[dir='rtl']:not([size]):not([multiple]) {
-  background-position: left .85rem top 50%;
+*[dir=rtl] select:not([size]):not([multiple]),
+select[dir=rtl]:not([size]):not([multiple]) {
+  background-position: left 0.85rem top 50%;
   padding-right: 7.5px;
   padding-right: 0.75rem;
   padding-left: 20px;
   padding-left: 2rem;
 }
 
-@media screen and (min-width: 0\0) and (min-resolution: 0.001dpcm) {
-  select:not([size]):not([multiple]) {
-    padding-right: 7.5px;
-  }
-  *[dir='rtl'] select:not([size]):not([multiple]),
-  select[dir='rtl']:not([size]):not([multiple]) {
-    padding-left: 7.5px;
-  }
-  select:not([size]):not([multiple]),
-  *[dir="rtl"] select:not([size]):not([multiple]),
-  select[dir="rtl"]:not([size]):not([multiple]) {
-    background-image: none;
-    background-repeat: repeat;
-  }
-}
-
 @supports ((-webkit-appearance: none) or (-moz-appearance: none) or (appearance: none)) {
-  [type='checkbox'],
-  [type='radio'] {
+  [type=checkbox],
+[type=radio] {
     -webkit-appearance: none;
        -moz-appearance: none;
             appearance: none;
@@ -1011,45 +914,44 @@ select[dir='rtl']:not([size]):not([multiple]) {
     position: relative;
     border: 1px solid #999;
   }
-  [type='checkbox'] + label,
-  [type='radio'] + label {
+  [type=checkbox] + label,
+[type=radio] + label {
     line-height: 1.8rem;
     vertical-align: top;
     margin-left: 5px;
     margin-left: 0.5rem;
   }
-  *[dir='rtl'] [type='checkbox'] + label,
-  [type='checkbox'][dir='rtl'] + label, *[dir='rtl']
-  [type='radio'] + label,
-  [type='radio'][dir='rtl'] + label {
+  *[dir=rtl] [type=checkbox] + label, [type=checkbox][dir=rtl] + label,
+*[dir=rtl] [type=radio] + label,
+[type=radio][dir=rtl] + label {
     margin-left: 0;
     margin-right: 5px;
     margin-right: 0.5rem;
   }
-  [type='checkbox']:after,
-  [type='radio']:after {
-    content: '';
+  [type=checkbox]:after,
+[type=radio]:after {
+    content: "";
     display: block;
     position: absolute;
   }
-  [type='checkbox']:checked,
-  [type='radio']:checked {
+  [type=checkbox]:checked,
+[type=radio]:checked {
     background-color: #007bff;
     border-color: #000;
   }
-  [type='radio']:after {
+  [type=radio]:after {
     width: 1.8rem;
     height: 1.8rem;
-    left: -.05rem;
-    top: -.05rem;
+    left: -0.05rem;
+    top: -0.05rem;
     border-radius: 50%;
     background: #fff;
     -webkit-transform: scale(0.35);
             transform: scale(0.35);
   }
-  [type='checkbox']:after {
-    width: .6rem;
-    height: .8rem;
+  [type=checkbox]:after {
+    width: 0.6rem;
+    height: 0.8rem;
     border: 2px solid #fff;
     border-top: 0;
     border-left: 0;
@@ -1059,31 +961,30 @@ select[dir='rtl']:not([size]):not([multiple]) {
             transform: rotate(43deg);
   }
 }
-
 @supports ((-webkit-appearance: none) or (-moz-appearance: none) or (appearance: none)) {
-  [type='range'] {
+  [type=range] {
     -webkit-appearance: none;
        -moz-appearance: none;
             appearance: none;
     width: 100%;
     height: 1.4rem;
   }
-  [type='range']::-webkit-slider-thumb {
+  [type=range]::-webkit-slider-thumb {
     border: 0;
     -webkit-appearance: none;
             appearance: none;
     width: 1.5rem;
     height: 1.5rem;
-    margin-top: -.25rem;
+    margin-top: -0.25rem;
     background-color: #007bff;
     border-radius: 1.5rem;
-    -webkit-transition: background-color .15s ease-in-out,
 border-color .15s ease-in-out, box-shadow .15s ease-in-out;
-    transition: background-color .15s ease-in-out,
 border-color .15s ease-in-out, box-shadow .15s ease-in-out;
+    -webkit-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+    transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
   }
-  [type='range']::-webkit-slider-thumb:active {
+  [type=range]::-webkit-slider-thumb:active {
     background-color: #007bff;
   }
-  [type='range']::-moz-range-thumb {
+  [type=range]::-moz-range-thumb {
     border: 0;
     -moz-appearance: none;
          appearance: none;
@@ -1091,57 +992,53 @@ select[dir='rtl']:not([size]):not([multiple]) {
     height: 1.5rem;
     background-color: #007bff;
     border-radius: 1.5rem;
-    -moz-transition: background-color .15s ease-in-out,
 border-color .15s ease-in-out, box-shadow .15s ease-in-out;
-    transition: background-color .15s ease-in-out,
 border-color .15s ease-in-out, box-shadow .15s ease-in-out;
+    -moz-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+    transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
   }
-  [type='range']::-moz-range-thumb:active {
+  [type=range]::-moz-range-thumb:active {
     background-color: #007bff;
   }
-  [type='range']::-webkit-slider-runnable-track {
+  [type=range]::-webkit-slider-runnable-track {
     color: transparent;
     border-color: transparent;
     width: 100%;
-    height: .65rem;
+    height: 0.65rem;
     cursor: pointer;
     background-color: #e9e9e9;
   }
-  [type='range']::-moz-range-track {
+  [type=range]::-moz-range-track {
     color: transparent;
     border-color: transparent;
     width: 100%;
-    height: .65rem;
+    height: 0.65rem;
     cursor: pointer;
     background-color: #e9e9e9;
   }
-  [type='range']:focus {
+  [type=range]:focus {
     outline: none;
   }
-  [type='range']:focus::-webkit-slider-thumb {
+  [type=range]:focus::-webkit-slider-thumb {
     box-shadow: 0 0 0 0.1rem #fff, 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
   }
-  [type='range']:focus::-moz-slider-thumb {
+  [type=range]:focus::-moz-slider-thumb {
     box-shadow: 0 0 0 0.1rem #fff, 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
   }
-  [type='range']::-moz-focus-outer {
+  [type=range]::-moz-focus-outer {
     border: 0;
   }
-  [type='range']:focus::-webkit-slider-thumb {
-    box-shadow: 0 0 0 0.1rem #fff, 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
-  }
-  [type='range']:focus::-moz-range-thumb {
+  [type=range]:focus::-moz-range-thumb {
     box-shadow: 0 0 0 0.1rem #fff, 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
   }
-  [type='range']:disabled {
+  [type=range]:disabled {
     pointer-events: none;
   }
-  [type='range']:disabled::-webkit-slider-thumb {
+  [type=range]:disabled::-webkit-slider-thumb {
     background-color: #ccc;
   }
-  [type='range']:disabled::-moz-slider-thumb {
+  [type=range]:disabled::-moz-slider-thumb {
     background-color: #ccc;
   }
 }
-
 table {
   max-width: 100%;
   border-collapse: collapse;
@@ -1195,14 +1092,12 @@ caption {
   padding-right: 15px;
   padding-right: 1.5rem;
 }
-
 .bf-container:before, .bf-container:after,
 .bf-container--fluid:before,
 .bf-container--fluid:after {
   display: table;
-  content: ' ';
+  content: " ";
 }
-
 .bf-container:after,
 .bf-container--fluid:after {
   clear: both;
@@ -1220,17 +1115,15 @@ caption {
   margin-right: -15px;
   margin-right: -1.5rem;
 }
-
 .bf-row:before, .bf-row:after {
-  content: ' ';
+  content: " ";
   display: table;
 }
-
 .bf-row:after {
   clear: both;
 }
 
-[class^='bf-col-'] {
+[class^=bf-col-] {
   float: left;
   position: relative;
   min-height: 1px;
@@ -1245,7 +1138,7 @@ caption {
   margin-left: 0;
 }
 
-.bf-no-gutters > [class^='bf-col'] {
+.bf-no-gutters > [class^=bf-col] {
   padding-right: 0;
   padding-left: 0;
 }
@@ -1255,11 +1148,11 @@ caption {
 }
 
 .bf-col-11 {
-  width: 91.66666666666666%;
+  width: 91.6666666667%;
 }
 
 .bf-col-10 {
-  width: 83.33333333333334%;
+  width: 83.3333333333%;
 }
 
 .bf-col-9 {
@@ -1267,11 +1160,11 @@ caption {
 }
 
 .bf-col-8 {
-  width: 66.66666666666666%;
+  width: 66.6666666667%;
 }
 
 .bf-col-7 {
-  width: 58.333333333333336%;
+  width: 58.3333333333%;
 }
 
 .bf-col-6 {
@@ -1279,11 +1172,11 @@ caption {
 }
 
 .bf-col-5 {
-  width: 41.66666666666667%;
+  width: 41.6666666667%;
 }
 
 .bf-col-4 {
-  width: 33.33333333333333%;
+  width: 33.3333333333%;
 }
 
 .bf-col-3 {
@@ -1291,7 +1184,7 @@ caption {
 }
 
 .bf-col-2 {
-  width: 16.666666666666664%;
+  width: 16.6666666667%;
 }
 
 .bf-col-1 {
@@ -1303,7 +1196,7 @@ caption {
     margin-left: 0;
     margin-right: 0;
   }
-  .bf-container--break-xs [class^='bf-col'] {
+  .bf-container--break-xs [class^=bf-col] {
     width: 100%;
     float: none;
     margin-left: 0;
@@ -1311,13 +1204,12 @@ caption {
     padding-right: 0;
   }
 }
-
 @media (max-width: 767px) {
   .bf-container--break-md .bf-row {
     margin-left: 0;
     margin-right: 0;
   }
-  .bf-container--break-md [class^='bf-col'] {
+  .bf-container--break-md [class^=bf-col] {
     width: 100%;
     float: none;
     margin-left: 0;
@@ -1325,13 +1217,12 @@ caption {
     padding-right: 0;
   }
 }
-
 @media (max-width: 991px) {
   .bf-container--break-lg .bf-row {
     margin-left: 0;
     margin-right: 0;
   }
-  .bf-container--break-lg [class^='bf-col'] {
+  .bf-container--break-lg [class^=bf-col] {
     width: 100%;
     float: none;
     margin-left: 0;
@@ -1339,15 +1230,14 @@ caption {
     padding-right: 0;
   }
 }
-
-table td[class^='bf-col'],
-table th[class^='bf-col'] {
+table td[class^=bf-col],
+table th[class^=bf-col] {
   position: static;
 }
 
 .bf-clearfix:before,
 .bf-clearfix:after {
-  content: ' ';
+  content: " ";
   display: table;
 }
 
@@ -1365,6 +1255,7 @@ table th[class^='bf-col'] {
 }
 
 .bf-text-hide {
+  /* stylelint-disable-next-line */
   font: 0/0 a !important;
   color: transparent !important;
   text-shadow: none !important;
@@ -1374,15 +1265,15 @@ table th[class^='bf-col'] {
   padding: 0 !important;
 }
 
-/*
-// taken from https://github.com/h5bp/html5-boilerplate/blob/v7.3.0/dist/css/main.css
-// 
-* Hide only visually, but have it available for screen readers:
-* https://snook.ca/archives/html_and_css/hiding-content-for-accessibility
-*
-* 1. For long content, line feeds are not interpreted as spaces and small width
-*    causes content to wrap 1 word per line:
-*    https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
+/*
+// taken from https://github.com/h5bp/html5-boilerplate/blob/v7.3.0/dist/css/main.css
+// 
+* Hide only visually, but have it available for screen readers:
+* https://snook.ca/archives/html_and_css/hiding-content-for-accessibility
+*
+* 1. For long content, line feeds are not interpreted as spaces and small width
+*    causes content to wrap 1 word per line:
+*    https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
 */
 .bf-sr-only {
   border: 0 !important;
@@ -1396,12 +1287,12 @@ table th[class^='bf-col'] {
   width: 1px !important;
 }
 
-/*
-// taken from https://github.com/h5bp/html5-boilerplate/blob/v7.3.0/dist/css/main.css
-// 
-* Extends the .sr-only class to allow the element
-* to be focusable when navigated to via the keyboard:
-* https://www.drupal.org/node/897638
+/*
+// taken from https://github.com/h5bp/html5-boilerplate/blob/v7.3.0/dist/css/main.css
+// 
+* Extends the .sr-only class to allow the element
+* to be focusable when navigated to via the keyboard:
+* https://www.drupal.org/node/897638
 */
 .bf-sr-only.focusable:active,
 .bf-sr-only.focusable:focus {
@@ -1520,7 +1411,7 @@ table th[class^='bf-col'] {
 }
 
 .bf-width-33 {
-  width: 33.33333333333333% !important;
+  width: 33.3333333333% !important;
 }
 
 .bf-width-50 {
@@ -1539,31 +1430,6 @@ table th[class^='bf-col'] {
   width: auto !important;
 }
 
-.bf-filter-invert {
-  -webkit-filter: invert(100%) !important;
-          filter: invert(100%) !important;
-}
-
-.bf-filter-dim-images {
-  -webkit-filter: brightness(0.8) contrast(1.2);
-          filter: brightness(0.8) contrast(1.2);
-}
-
-.bf-filter-grayscale {
-  -webkit-filter: grayscale(1) !important;
-          filter: grayscale(1) !important;
-}
-
-.bf-filter-blur {
-  -webkit-filter: blur(0.3rem) !important;
-          filter: blur(0.3rem) !important;
-}
-
-.bf-filter-none {
-  -webkit-filter: none !important;
-          filter: none !important;
-}
-
 .bf-z-index-1 {
   z-index: 1;
 }
@@ -1876,7 +1742,6 @@ table th[class^='bf-col'] {
 .bf-no-select {
   -webkit-user-select: none !important;
      -moz-user-select: none !important;
-      -ms-user-select: none !important;
           user-select: none !important;
   -webkit-touch-callout: none !important;
 }
@@ -1947,19 +1812,17 @@ body.bf-responsive-typography {
     font-size: var(--body-rt-font-size-flex);
   }
 }
-
 @media (min-width: 1000px) {
   body.bf-responsive-typography {
     font-size: var(--body-rt-font-size-max);
   }
 }
-
 .bf-btn {
   display: inline-block;
   cursor: pointer;
   color: #222;
-  padding: 6.66667px 13.33333px;
-  padding: 0.66667rem 1.33333rem;
+  padding: 6.6666666667px 13.3333333333px;
+  padding: 0.6666666667rem 1.3333333333rem;
   line-height: normal;
   text-align: center;
   margin: 0;
@@ -1969,40 +1832,33 @@ body.bf-responsive-typography {
   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   border-radius: 2.5px;
   border-radius: 0.25rem;
   border: 0;
   background-image: none;
-  background: #ccc;
-  transition: all .2s;
+  background-color: #ccc;
+  transition: all 0.2s;
 }
-
 .bf-btn:hover, .bf-btn:active, .bf-btn:focus {
   text-decoration: none;
   color: #222;
   background: #b3b3b3;
 }
-
 .bf-btn:active, .bf-btn:focus {
   box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.15);
 }
-
 .bf-btn:focus {
   outline: 0;
 }
-
 .bf-btn.bf-btn--primary {
   color: #fff;
   background: #007bff;
 }
-
 .bf-btn.bf-btn--primary:hover, .bf-btn.bf-btn--primary:active, .bf-btn.bf-btn--primary:focus {
   color: #fff;
   background: #0062cc;
 }
-
 .bf-btn.bf-btn--primary:active, .bf-btn.bf-btn--primary:focus {
   box-shadow: 0 0 0 3px rgba(0, 86, 179, 0.25);
 }
@@ -2010,20 +1866,19 @@ body.bf-responsive-typography {
 fieldset[disabled] .bf-btn,
 .bf-btn[disabled],
 .bf-btn:disabled,
-.bf-btn[aria-disabled='true'] {
+.bf-btn[aria-disabled=true] {
   cursor: default !important;
   cursor: not-allowed !important;
   pointer-events: none !important;
   -webkit-user-select: none !important;
      -moz-user-select: none !important;
-      -ms-user-select: none !important;
           user-select: none !important;
   box-shadow: none !important;
-  opacity: .5 !important;
+  opacity: 0.5 !important;
 }
 
 .bf-focused {
-  transition: border .2s, background-color .2s, box-shadow .2s !important;
+  transition: border 0.2s, background-color 0.2s, box-shadow 0.2s !important;
   border-color: #007bff !important;
   box-shadow: 0 0 0 3px rgba(0, 86, 179, 0.25) !important;
 }
@@ -2041,10 +1896,9 @@ fieldset[disabled] .bf-btn,
   pointer-events: none !important;
   -webkit-user-select: none !important;
      -moz-user-select: none !important;
-      -ms-user-select: none !important;
           user-select: none !important;
   box-shadow: none !important;
-  opacity: .5 !important;
+  opacity: 0.5 !important;
   background-color: #fff;
   border-color: #999;
 }
@@ -2055,33 +1909,31 @@ label.bf-disabled {
 }
 
 button.bf-disabled,
-[type='button'].bf-disabled,
-[type='reset'].bf-disabled,
-[type='submit'].bf-disabled,
+[type=button].bf-disabled,
+[type=reset].bf-disabled,
+[type=submit].bf-disabled,
 .bf-btn.bf-disabled {
   cursor: default;
   cursor: not-allowed;
   pointer-events: none;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   box-shadow: none;
-  opacity: .5;
+  opacity: 0.5;
   color: #222;
   background: #ccc;
 }
-
 button.bf-disabled:hover, button.bf-disabled:active, button.bf-disabled:focus,
-[type='button'].bf-disabled:hover,
-[type='button'].bf-disabled:active,
-[type='button'].bf-disabled:focus,
-[type='reset'].bf-disabled:hover,
-[type='reset'].bf-disabled:active,
-[type='reset'].bf-disabled:focus,
-[type='submit'].bf-disabled:hover,
-[type='submit'].bf-disabled:active,
-[type='submit'].bf-disabled:focus,
+[type=button].bf-disabled:hover,
+[type=button].bf-disabled:active,
+[type=button].bf-disabled:focus,
+[type=reset].bf-disabled:hover,
+[type=reset].bf-disabled:active,
+[type=reset].bf-disabled:focus,
+[type=submit].bf-disabled:hover,
+[type=submit].bf-disabled:active,
+[type=submit].bf-disabled:focus,
 .bf-btn.bf-disabled:hover,
 .bf-btn.bf-disabled:active,
 .bf-btn.bf-disabled:focus {
@@ -2096,14 +1948,12 @@ button.bf-disabled:hover, button.bf-disabled:active, button.bf-disabled:focus,
   pointer-events: none;
   -webkit-user-select: none;
      -moz-user-select: none;
-      -ms-user-select: none;
           user-select: none;
   box-shadow: none;
-  opacity: .5;
+  opacity: 0.5;
   color: #fff;
   background: #007bff;
 }
-
 .bf-btn--primary.bf-disabled:hover, .bf-btn--primary.bf-disabled:active, .bf-btn--primary.bf-disabled:focus {
   box-shadow: none;
   color: #fff;
@@ -2141,22 +1991,15 @@ dt {
   padding: 0;
   overflow: hidden;
 }
-
 .bf-embed-responsive::before {
   display: block;
-  content: '';
+  content: "";
   padding-top: 56.25%;
 }
-
 .bf-embed-responsive .bf-embed-responsive--4-3::before {
   padding-top: 75%;
 }
-
-.bf-embed-responsive .bf-embed-responsive--item,
-.bf-embed-responsive iframe,
-.bf-embed-responsive embed,
-.bf-embed-responsive object,
-.bf-embed-responsive video {
+.bf-embed-responsive .bf-embed-responsive--item, .bf-embed-responsive iframe, .bf-embed-responsive embed, .bf-embed-responsive object, .bf-embed-responsive video {
   position: absolute;
   top: 0;
   bottom: 0;
@@ -2196,16 +2039,16 @@ dt {
   background-color: #e9e9e9;
 }
 
-/* main.css 2.1.0 | MIT License | https://github.com/h5bp/main.css#readme */
-/* ==========================================================================
-   Print styles.
-   Inlined to avoid the additional HTTP request:
-   https://www.phpied.com/delay-loading-your-print-css/
+/* main.css 3.0.0 | MIT License | https://github.com/h5bp/main.css#readme */
+/* ==========================================================================
+   Print styles.
+   Inlined to avoid the additional HTTP request:
+   https://www.phpied.com/delay-loading-your-print-css/
    ========================================================================== */
 @media print {
   *,
-  *::before,
-  *::after {
+*::before,
+*::after {
     background: #fff !important;
     color: #000 !important;
     /* Black prints faster */
@@ -2213,7 +2056,7 @@ dt {
     text-shadow: none !important;
   }
   a,
-  a:visited {
+a:visited {
     text-decoration: underline;
   }
   a[href]::after {
@@ -2222,48 +2065,40 @@ dt {
   abbr[title]::after {
     content: " (" attr(title) ")";
   }
-  /*
-   * Don't show links that are fragment identifiers,
-   * or use the `javascript:` pseudo protocol
-   */
-  a[href^='#']::after,
-  a[href^='javascript:']::after {
-    content: '';
+  /*
+     * Don't show links that are fragment identifiers,
+     * or use the `javascript:` pseudo protocol
+     */
+  a[href^="#"]::after,
+a[href^="javascript:"]::after {
+    content: "";
   }
   pre {
     white-space: pre-wrap !important;
   }
   pre,
-  blockquote {
+blockquote {
     border: 1px solid #999;
     page-break-inside: avoid;
   }
-  /*
-   * Printing Tables:
-   * https://web.archive.org/web/20180815150934/http://css-discuss.incutio.com/wiki/Printing_Tables
-   */
-  thead {
-    display: table-header-group;
-  }
   tr,
-  img {
+img {
     page-break-inside: avoid;
   }
   p,
-  h2,
-  h3 {
+h2,
+h3 {
     orphans: 3;
     widows: 3;
   }
   h2,
-  h3 {
+h3 {
     page-break-after: avoid;
   }
 }
-
 @media print {
   body,
-  .bf-container {
+.bf-container {
     min-width: 992px !important;
   }
   .bf-table-responsive {
@@ -2273,18 +2108,17 @@ dt {
     width: auto;
   }
   .bf-table-responsive table,
-  .bf-table {
+.bf-table {
     border-collapse: collapse !important;
   }
 }
-
 @media (prefers-reduced-motion: reduce) {
   .bf-reduced-motion,
-  .bf-reduced-motion::before,
-  .bf-reduced-motion::after,
-  .bf-reduced-motion *,
-  .bf-reduced-motion *::before,
-  .bf-reduced-motion *::after {
+.bf-reduced-motion::before,
+.bf-reduced-motion::after,
+.bf-reduced-motion *,
+.bf-reduced-motion *::before,
+.bf-reduced-motion *::after {
     -webkit-animation-delay: -1ms !important;
             animation-delay: -1ms !important;
     -webkit-animation-duration: 1ms !important;
@@ -2297,11 +2131,10 @@ dt {
     transition-duration: 0s !important;
   }
 }
-
 /**
  * Change the cursor on busy elements in all browsers (opinionated).
  */
-[aria-busy="true"] {
+[aria-busy=true] {
   cursor: progress;
 }
 
@@ -2316,7 +2149,7 @@ dt {
  * Change the cursor on disabled, not-editable, or otherwise
  * inoperable elements in all browsers (opinionated).
  */
-[aria-disabled="true"],
+[aria-disabled=true],
 [disabled] {
   cursor: not-allowed;
 }
@@ -2325,11 +2158,11 @@ dt {
  * Change the display on visually hidden accessible elements
  * in all browsers (opinionated).
  */
-[aria-hidden="false"][hidden] {
+[aria-hidden=false][hidden] {
   display: initial;
 }
 
-[aria-hidden="false"][hidden]:not(:focus) {
+[aria-hidden=false][hidden]:not(:focus) {
   clip: rect(0, 0, 0, 0);
   position: absolute;
 }
@@ -2342,15 +2175,15 @@ dt {
     width: 1.5rem;
     height: 1.5rem;
   }
+  ::-webkit-scrollbar-track {
+    background-color: #111;
+  }
   ::-webkit-scrollbar-thumb {
     background-color: #595959;
   }
   ::-webkit-scrollbar-thumb:hover {
     background-color: gray;
   }
-  ::-webkit-scrollbar-track {
-    background-color: #111;
-  }
   html {
     color: #f0f0f0;
   }
@@ -2369,103 +2202,94 @@ dt {
   ins {
     background-color: #b3b300;
   }
-  .bf-table th,
-  .bf-table td {
-    border-color: #666;
-  }
-  [type='email'],
-  [type='number'],
-  [type='password'],
-  [type='tel'],
-  [type='search'],
-  [type='text'],
-  [type='date'],
-  [type='datetime-local'],
-  [type='month'],
-  [type='time'],
-  [type='week'],
-  [type='time'],
-  [type='url'],
-  [type='range'],
-  input[list],
-  select,
-  select:not([size]):not([multiple]),
-  textarea {
+  [type=email],
+[type=number],
+[type=password],
+[type=tel],
+[type=search],
+[type=text],
+[type=date],
+[type=datetime-local],
+[type=month],
+[type=week],
+[type=time],
+[type=url],
+[type=range],
+input[list],
+select,
+select:not([size]):not([multiple]),
+textarea {
     background-color: #111;
     border-color: #000;
     color: #ccc;
   }
-  [type='email']:active, [type='email']:focus,
-  [type='number']:active,
-  [type='number']:focus,
-  [type='password']:active,
-  [type='password']:focus,
-  [type='tel']:active,
-  [type='tel']:focus,
-  [type='search']:active,
-  [type='search']:focus,
-  [type='text']:active,
-  [type='text']:focus,
-  [type='date']:active,
-  [type='date']:focus,
-  [type='datetime-local']:active,
-  [type='datetime-local']:focus,
-  [type='month']:active,
-  [type='month']:focus,
-  [type='time']:active,
-  [type='time']:focus,
-  [type='week']:active,
-  [type='week']:focus,
-  [type='time']:active,
-  [type='time']:focus,
-  [type='url']:active,
-  [type='url']:focus,
-  [type='range']:active,
-  [type='range']:focus,
-  input[list]:active,
-  input[list]:focus,
-  select:active,
-  select:focus,
-  select:not([size]):not([multiple]):active,
-  select:not([size]):not([multiple]):focus,
-  textarea:active,
-  textarea:focus {
+  [type=email]:active, [type=email]:focus,
+[type=number]:active,
+[type=number]:focus,
+[type=password]:active,
+[type=password]:focus,
+[type=tel]:active,
+[type=tel]:focus,
+[type=search]:active,
+[type=search]:focus,
+[type=text]:active,
+[type=text]:focus,
+[type=date]:active,
+[type=date]:focus,
+[type=datetime-local]:active,
+[type=datetime-local]:focus,
+[type=month]:active,
+[type=month]:focus,
+[type=week]:active,
+[type=week]:focus,
+[type=time]:active,
+[type=time]:focus,
+[type=url]:active,
+[type=url]:focus,
+[type=range]:active,
+[type=range]:focus,
+input[list]:active,
+input[list]:focus,
+select:active,
+select:focus,
+select:not([size]):not([multiple]):active,
+select:not([size]):not([multiple]):focus,
+textarea:active,
+textarea:focus {
     background-color: #111;
     border-color: #3395ff;
   }
-  [type='email']:active, [type='email']:focus,
-  [type='number']:active,
-  [type='number']:focus,
-  [type='password']:active,
-  [type='password']:focus,
-  [type='tel']:active,
-  [type='tel']:focus,
-  [type='search']:active,
-  [type='search']:focus,
-  [type='text']:active,
-  [type='text']:focus,
-  [type='date']:active,
-  [type='date']:focus,
-  [type='datetime-local']:active,
-  [type='datetime-local']:focus,
-  [type='month']:active,
-  [type='month']:focus,
-  [type='time']:active,
-  [type='time']:focus,
-  [type='week']:active,
-  [type='week']:focus,
-  [type='time']:active,
-  [type='time']:focus,
-  [type='url']:active,
-  [type='url']:focus,
-  input[list]:active,
-  input[list]:focus,
-  select:active,
-  select:focus,
-  select:not([size]):not([multiple]):active,
-  select:not([size]):not([multiple]):focus,
-  textarea:active,
-  textarea:focus {
+  [type=email]:active, [type=email]:focus,
+[type=number]:active,
+[type=number]:focus,
+[type=password]:active,
+[type=password]:focus,
+[type=tel]:active,
+[type=tel]:focus,
+[type=search]:active,
+[type=search]:focus,
+[type=text]:active,
+[type=text]:focus,
+[type=date]:active,
+[type=date]:focus,
+[type=datetime-local]:active,
+[type=datetime-local]:focus,
+[type=month]:active,
+[type=month]:focus,
+[type=week]:active,
+[type=week]:focus,
+[type=time]:active,
+[type=time]:focus,
+[type=url]:active,
+[type=url]:focus,
+input[list]:active,
+input[list]:focus,
+select:active,
+select:focus,
+select:not([size]):not([multiple]):active,
+select:not([size]):not([multiple]):focus,
+textarea:active,
+textarea:focus {
     box-shadow: 0 0 0 3px rgba(3, 102, 214, 0.5);
   }
   .bf-focused {
@@ -2473,7 +2297,7 @@ dt {
     box-shadow: 0 0 0 3px rgba(3, 102, 214, 0.5) !important;
   }
   .bf-invalid,
-  .bf-invalid:focus {
+.bf-invalid:focus {
     color: #ff2626 !important;
     border-color: #ff2626 !important;
   }
@@ -2481,145 +2305,156 @@ dt {
     background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23f0f0f0' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e");
   }
 }
-
-@media screen and (prefers-color-scheme: dark) and (min-width: 0\0) and (min-resolution: 0.001dpcm) {
+@media screen and (prefers-color-scheme: dark) and (min-width: 0\0 ) and (-webkit-min-device-pixel-ratio: 0), screen and (prefers-color-scheme: dark) and (min-width: 0\0 ) and (min-resolution: 0.001dpcm) {
   select:not([size]):not([multiple]),
-  *[dir="rtl"] select:not([size]):not([multiple]),
-  select[dir="rtl"]:not([size]):not([multiple]) {
+*[dir=rtl] select:not([size]):not([multiple]),
+select[dir=rtl]:not([size]):not([multiple]) {
     background-image: none;
   }
 }
-
 @media (prefers-color-scheme: dark) {
   @supports ((-webkit-appearance: none) or (-moz-appearance: none) or (appearance: none)) {
-    [type='range'] {
+    [type=range] {
       background-color: transparent;
     }
-    [type='range']:focus {
+    [type=range]:focus {
       background-color: transparent;
     }
-    [type='range']::-webkit-slider-runnable-track {
+    [type=range]::-webkit-slider-runnable-track {
       background-color: #111;
     }
-    [type='range']::-moz-range-track {
+    [type=range]::-moz-range-track {
       background-color: #111;
     }
   }
+}
+@media (prefers-color-scheme: dark) {
   input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
     color: #999;
   }
   input::-moz-placeholder, textarea::-moz-placeholder {
     color: #999;
   }
-  input:-ms-input-placeholder, textarea:-ms-input-placeholder {
-    color: #999;
-  }
   input::placeholder,
-  textarea::placeholder {
+textarea::placeholder {
     color: #999;
   }
+}
+@media (prefers-color-scheme: dark) {
   button,
-  [type='button'],
-  [type='reset'],
-  [type='submit'],
-  .bf-btn,
-  button.bf-disabled,
-  [type='button'].bf-disabled,
-  [type='reset'].bf-disabled,
-  [type='submit'].bf-disabled,
-  .bf-btn.bf-disabled {
+[type=button],
+[type=reset],
+[type=submit],
+.bf-btn,
+button.bf-disabled,
+[type=button].bf-disabled,
+[type=reset].bf-disabled,
+[type=submit].bf-disabled,
+.bf-btn.bf-disabled {
     background: #ccc;
   }
   button:hover, button:active, button:focus,
-  [type='button']:hover,
-  [type='button']:active,
-  [type='button']:focus,
-  [type='reset']:hover,
-  [type='reset']:active,
-  [type='reset']:focus,
-  [type='submit']:hover,
-  [type='submit']:active,
-  [type='submit']:focus,
-  .bf-btn:hover,
-  .bf-btn:active,
-  .bf-btn:focus,
-  button.bf-disabled:hover,
-  button.bf-disabled:active,
-  button.bf-disabled:focus,
-  [type='button'].bf-disabled:hover,
-  [type='button'].bf-disabled:active,
-  [type='button'].bf-disabled:focus,
-  [type='reset'].bf-disabled:hover,
-  [type='reset'].bf-disabled:active,
-  [type='reset'].bf-disabled:focus,
-  [type='submit'].bf-disabled:hover,
-  [type='submit'].bf-disabled:active,
-  [type='submit'].bf-disabled:focus,
-  .bf-btn.bf-disabled:hover,
-  .bf-btn.bf-disabled:active,
-  .bf-btn.bf-disabled:focus {
+[type=button]:hover,
+[type=button]:active,
+[type=button]:focus,
+[type=reset]:hover,
+[type=reset]:active,
+[type=reset]:focus,
+[type=submit]:hover,
+[type=submit]:active,
+[type=submit]:focus,
+.bf-btn:hover,
+.bf-btn:active,
+.bf-btn:focus,
+button.bf-disabled:hover,
+button.bf-disabled:active,
+button.bf-disabled:focus,
+[type=button].bf-disabled:hover,
+[type=button].bf-disabled:active,
+[type=button].bf-disabled:focus,
+[type=reset].bf-disabled:hover,
+[type=reset].bf-disabled:active,
+[type=reset].bf-disabled:focus,
+[type=submit].bf-disabled:hover,
+[type=submit].bf-disabled:active,
+[type=submit].bf-disabled:focus,
+.bf-btn.bf-disabled:hover,
+.bf-btn.bf-disabled:active,
+.bf-btn.bf-disabled:focus {
     background: #b3b3b3;
   }
   button:active, button:focus,
-  [type='button']:active,
-  [type='button']:focus,
-  [type='reset']:active,
-  [type='reset']:focus,
-  [type='submit']:active,
-  [type='submit']:focus,
-  .bf-btn:active,
-  .bf-btn:focus,
-  button.bf-disabled:active,
-  button.bf-disabled:focus,
-  [type='button'].bf-disabled:active,
-  [type='button'].bf-disabled:focus,
-  [type='reset'].bf-disabled:active,
-  [type='reset'].bf-disabled:focus,
-  [type='submit'].bf-disabled:active,
-  [type='submit'].bf-disabled:focus,
-  .bf-btn.bf-disabled:active,
-  .bf-btn.bf-disabled:focus {
+[type=button]:active,
+[type=button]:focus,
+[type=reset]:active,
+[type=reset]:focus,
+[type=submit]:active,
+[type=submit]:focus,
+.bf-btn:active,
+.bf-btn:focus,
+button.bf-disabled:active,
+button.bf-disabled:focus,
+[type=button].bf-disabled:active,
+[type=button].bf-disabled:focus,
+[type=reset].bf-disabled:active,
+[type=reset].bf-disabled:focus,
+[type=submit].bf-disabled:active,
+[type=submit].bf-disabled:focus,
+.bf-btn.bf-disabled:active,
+.bf-btn.bf-disabled:focus {
     box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.45);
   }
+}
+@media (prefers-color-scheme: dark) {
   button:active, button:focus,
-  [type='button']:active,
-  [type='button']:focus,
-  [type='reset']:active,
-  [type='reset']:focus,
-  [type='submit']:active,
-  [type='submit']:focus,
-  .bf-btn:active,
-  .bf-btn:focus {
+[type=button]:active,
+[type=button]:focus,
+[type=reset]:active,
+[type=reset]:focus,
+[type=submit]:active,
+[type=submit]:focus,
+.bf-btn:active,
+.bf-btn:focus {
     box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.45);
   }
+}
+@media (prefers-color-scheme: dark) {
   .bf-btn--primary.bf-disabled,
-  .bf-btn.bf-btn--primary {
+.bf-btn.bf-btn--primary {
     background: #007bff;
   }
   .bf-btn--primary.bf-disabled:hover, .bf-btn--primary.bf-disabled:active, .bf-btn--primary.bf-disabled:focus,
-  .bf-btn.bf-btn--primary:hover,
-  .bf-btn.bf-btn--primary:active,
-  .bf-btn.bf-btn--primary:focus {
+.bf-btn.bf-btn--primary:hover,
+.bf-btn.bf-btn--primary:active,
+.bf-btn.bf-btn--primary:focus {
     background: #006fe6;
   }
   .bf-btn--primary.bf-disabled:active, .bf-btn--primary.bf-disabled:focus,
-  .bf-btn.bf-btn--primary:active,
-  .bf-btn.bf-btn--primary:focus {
+.bf-btn.bf-btn--primary:active,
+.bf-btn.bf-btn--primary:focus {
     box-shadow: 0 0 0 3px rgba(0, 86, 179, 0.75);
   }
+}
+@media (prefers-color-scheme: dark) {
   a:focus,
-  input:focus {
+input:focus {
     outline-color: #b37400;
   }
+}
+@media (prefers-color-scheme: dark) {
   :focus-visible {
     outline-color: #b37400;
   }
+}
+@media (prefers-color-scheme: dark) {
   .bf-table th,
-  .bf-table td {
+.bf-table td {
     border-color: #666;
   }
+}
+@media (prefers-color-scheme: dark) {
   .bf-table--zebra tbody tr:nth-child(odd),
-  .bf-table-responsive--zebra tbody tr:nth-child(odd) {
+.bf-table-responsive--zebra tbody tr:nth-child(odd) {
     background-color: #333;
   }
-}
+}