nm3clol-express-app/assets/css/nm3clol.css

.result-highlight { background-color: #FBF719; font-weight: normal; }
.pt-1500 { padding-top: 100vh; }
:root {
  --bs-body-font-size: 1.2rem !important;
}
body {
  margin: 0;
  background: #fff;
  font-family: "Saira Extra Condensed", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
  -webkit-font-smoothing: antialiased;
}
p, li {
  font-family: "Noto Serif", "Times New Roman", Times, serif;
}
#files li {
  font-family: inherit;
}
h1, h2, h3, h4, h5, h6 {
  font-family: "Alegreya SC", system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  font-weight: 700;
}
.list-group-item {
  background-color: transparent;
}
.list-group-item-action:focus,.list-group-item-action:hover {
  background-color: rgba(244, 67, 54, 0.75);
  color: #fff;
}
.list-group-item-action:focus a,.list-group-item-action:hover a:visited {
  background-color: rgba(244, 67, 54, 0.75);
  color: #fff;
}
.list-group-item-action:focus a:focus,.list-group-item-action:hover a:hover {
  color: #fff !important;
  text-decoration: underline;
}
.bg-primary {
  background-color: #f44336 !important;
}
.nmc3clol-navbar-brand {
  font-family: "Cinzel Decorative";
  text-transform: capitalize !important;
}
.daball-navbar-brand {
  font-family: "Saira Extra Condensed";
}
main {
  max-width: 100vw;
  margin-top: 50px;
}
header {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.nm3clol-navbar-brand, .navbar {
  font-size: 1.2rem !important;
}
@media (min-width: 0px) and (max-width: 576px) {
  .nm3clol-navbar-brand, .navbar {
    font-size: 0.55rem !important;
  }
}
@media (min-width: 576px) and (max-width: 768px) {
  .nm3clol-navbar-brand, .navbar {
    font-size: 0.75rem !important;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .nm3clol-navbar-brand, .navbar {
    font-size: 1.0rem !important;
  }
}
.btn-outline-search {
  color: #fff;
  border-color: #fff;
}
.btn-outline-search:hover {
  color: #f44336;
  border-color: #f44336;
  background-color: rgba(255, 255, 255, 0.75);
}
h1 i {
  font-style: normal;
}
ul#files {
  margin: 0 0 0 -2px;
  padding: 20px 0 0 0;
}
ul#files li {
  list-style: none;
  font-size: 14px;
  display: flex;
  justify-content: space-between;
}
a {
  text-decoration: none;
}
ul#files a {
  color: #000;
  padding: 10px 5px;
  margin: 0 -5px;
  white-space: nowrap;
  overflow: hidden;
  display: block;
  width: 100%;
  text-overflow: ellipsis;
}
a {
  color: #f44336;
  display: inline-block;
  line-height: 20px;
}
a:hover, a:active {
  color: #0076ff;
  display: inline-block;
  line-height: 20px;
}
a .pretty, a .cool {
  display: none;
}
a:hover .david, a:active .david, a:hover .cool, a:active .cool {
  display: inline;
  color: #0076ff;
}
a:hover .allen, a:active .allen {
  display: inline;
  color: #fff;
}
a:hover .ball, a:active .ball, a:hover .pretty, a:active .pretty {
  display: inline;
  color: #f44336;
}
svg {
  height: 13px;
  vertical-align: text-bottom;
}
ul#files a::before {
  display: inline-block;
  vertical-align: middle;
  margin-right: 10px;
  width: 24px;
  text-align: center;
  line-height: 12px;
}
/* file-icon – svg inlined here, but it should also be possible to separate out. */
ul#files a.file::before {
  content: url("data:image/svg+xml;utf8,<svg width='15' height='19' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M10 8C8.34 8 7 6.66 7 5V1H3c-1.1 0-2 .9-2 2v13c0 1.1.9 2 2 2h9c1.1 0 2-.9 2-2V8h-4zM8 5c0 1.1.9 2 2 2h3.59L8 1.41V5zM3 0h5l7 7v9c0 1.66-1.34 3-3 3H3c-1.66 0-3-1.34-3-3V3c0-1.66 1.34-3 3-3z' fill='black'/></svg>");
}
ul#files a.file:hover::before {
  content: url("data:image/svg+xml;utf8,<svg width='15' height='19' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M10 8C8.34 8 7 6.66 7 5V1H3c-1.1 0-2 .9-2 2v13c0 1.1.9 2 2 2h9c1.1 0 2-.9 2-2V8h-4zM8 5c0 1.1.9 2 2 2h3.59L8 1.41V5zM3 0h5l7 7v9c0 1.66-1.34 3-3 3H3c-1.66 0-3-1.34-3-3V3c0-1.66 1.34-3 3-3z' fill='white'/></svg>");
  text-decoration: underline;
}
/* folder-icon */
ul#files a.folder::before {
  content: url("data:image/svg+xml;utf8,<svg width='20' height='16' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M18.784 3.87a1.565 1.565 0 0 0-.565-.356V2.426c0-.648-.523-1.171-1.15-1.171H8.996L7.908.25A.89.89 0 0 0 7.302 0H2.094C1.445 0 .944.523.944 1.171v2.3c-.21.085-.398.21-.565.356a1.348 1.348 0 0 0-.377 1.004l.398 9.83C.42 15.393 1.048 16 1.8 16h15.583c.753 0 1.36-.586 1.4-1.339l.398-9.83c.021-.313-.125-.69-.397-.962zM1.843 3.41V1.191c0-.146.104-.272.25-.272H7.26l1.234 1.088c.083.042.167.104.293.104h8.282c.125 0 .25.126.25.272V3.41H1.844zm15.54 11.712H1.78a.47.47 0 0 1-.481-.46l-.397-9.83c0-.147.041-.252.125-.356a.504.504 0 0 1 .377-.147H17.78c.125 0 .272.063.377.147.083.083.125.209.125.334l-.418 9.83c-.021.272-.23.482-.481.482z' fill='black'/></svg>");
}
ul#files a.folder:hover::before {
  content: url("data:image/svg+xml;utf8,<svg width='20' height='16' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M18.784 3.87a1.565 1.565 0 0 0-.565-.356V2.426c0-.648-.523-1.171-1.15-1.171H8.996L7.908.25A.89.89 0 0 0 7.302 0H2.094C1.445 0 .944.523.944 1.171v2.3c-.21.085-.398.21-.565.356a1.348 1.348 0 0 0-.377 1.004l.398 9.83C.42 15.393 1.048 16 1.8 16h15.583c.753 0 1.36-.586 1.4-1.339l.398-9.83c.021-.313-.125-.69-.397-.962zM1.843 3.41V1.191c0-.146.104-.272.25-.272H7.26l1.234 1.088c.083.042.167.104.293.104h8.282c.125 0 .25.126.25.272V3.41H1.844zm15.54 11.712H1.78a.47.47 0 0 1-.481-.46l-.397-9.83c0-.147.041-.252.125-.356a.504.504 0 0 1 .377-.147H17.78c.125 0 .272.063.377.147.083.083.125.209.125.334l-.418 9.83c-.021.272-.23.482-.481.482z' fill='white'/></svg>");
}
/* image-icon */
ul#files a.file.gif::before,
ul#files a.file.jpg::before,
ul#files a.file.png::before,
ul#files a.file.svg::before {
  content: url("data:image/svg+xml;utf8,<svg width='16' height='16' viewBox='0 0 80 80' xmlns='http://www.w3.org/2000/svg' fill='none' stroke='black' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'><rect x='6' y='6' width='68' height='68' rx='5' ry='5'/><circle cx='24' cy='24' r='8'/><path d='M73 49L59 34 37 52m16 20L27 42 7 58'/></svg>");
}
::selection {
  background-color: #f44336;
  color: #fff;
}
::-moz-selection {
  background-color: #f44336;
  color: #fff;
}
.bg-primary ::selection {
  background-color: #fff;
  color: #f44336;
}
.bg-primary ::-moz-selection {
  background-color: #fff;
  color: #f44336;
}
header h1 {
  font-size: 2em;
}

header h1 .separator {
  font-size: 4.0rem;
  line-height: 1rem;
  vertical-align: -.75vh;
}
@media (max-width: 1200px) {
  header h1 {
    font-size: 1.5rem;
  }
  header h1 .separator {
    font-size: 2em;
    line-height: 1em;
    vertical-align: -.75vh;
  }
}
@media (min-width: 768px) {
  ul#files {
  display: flex;
  flex-wrap: wrap;
  }
}
@media (min-width: 992px) {
  /* body {
  padding: 45px;
  } */
  ul#files li {
  font-size: 16pt;
  box-sizing: border-box;
  justify-content: flex-start;
  }
}
img.no-trash-svg {
  z-index: -10000;
  position: fixed;
  width: 1.5%;
  opacity: 0.04;
  top: 50%;
  left: 50%;
  margin-top: -0.5vh;
  margin-left: -1.5vh;
  transform: scale(35, 35);
}

table {
  margin-bottom: 5pt;
}

tbody, td, tfoot, th, thead, tr {
  font-family: 'Sometype Mono';
  padding: 5pt;
}

thead {
  border-bottom: 2pt solid #222;
}

.total {
  border-top: 5pt double #222;
}

.winner {
  color: #00A000;
}

tr.republican, tr.democratic, tr.independent, tr.write-in {
  padding-top: 1pt;
}

tr.republican .progress, tr.democratic .progress, tr.independent .progress, tr.write-in .progress {
  border-radius: 0;
}

tr.republican .progress-bar {
  background-color: #f44336;
  color: #f44336;
}

tr.democratic .progress-bar {
  background-color: #0076ff;
  color: #0076ff;
}

tr.independent .progress-bar {
  background-color: #ffa500;
  color: #ffa500;
}

tr.write-in .progress-bar {
  background-color: #555;
  color: #555;
}

tr.republican td:first-child, tr.democratic td:first-child, tr.independent td:first-child, tr.write-in td:first-child {
  border-left: 6pt solid;
}

tr.republican td:first-child {
  border-color: #f44336;
}

tr.democratic td:first-child {
  border-color: #0076ff;
}

tr.independent td:first-child {
  border-color: #ffa500;
}

tr.write-in td:first-child {
  border-color: #555;
}

@media print{
  @page { size: portrait; }
  body { font-size: 12pt; background-color: #fff; }
  img.no-trash-svg { display: none; visibility: hidden; opacity: 0.00; }
  .page-break { page-break-after: always; }
  .navbar { position: relative; }
  img, a img, a:link img, a:visited img, a:hover img, a:active img{
    width: auto !important;
    page-break-inside: avoid !important;
    max-height: 85vh !important;
    max-width: 85vw !important;
  }
  embed {
    width: 90vw !important;
    page-break-inside: avoid !important;
    max-height: 80vh !important;
    max-width: 80vw !important;
    display: block;
  }
  .container { max-width: fit-content; }
  .nmc3clol-navbar-brand { color: #f44336; }
  .daball-navbar-brand { color: #000; }
  .pt-1500 { padding-top: 150px;}
}

.ui-resizable-helper { border: 2px dotted #f44336; }