1:root {
  2    --jumbotron-padding-y: 3rem;
  3    /* Using Open Color 1.9.1: https://yeun.github.io/open-color/ */
  4    --background0: #212529; /* GRAY 9 */
  5    --background1: #343a40; /* GRAY 8 */
  6    --accent: #1864ab; /* BLUE 9 */
  7    --title: #339af0; /* BLUE 5 */
  8    --text: #f8f9fa; /* GRAY 0 */
  9  }
 10  
 11  .jumbotron {
 12    padding-top: var(--jumbotron-padding-y);
 13    padding-bottom: var(--jumbotron-padding-y);
 14    margin-bottom: 0;
 15    background-color: var(--background1);
 16  }
 17  @media (min-width: 768px) {
 18    .jumbotron {
 19      padding-top: calc(var(--jumbotron-padding-y) * 2);
 20      padding-bottom: calc(var(--jumbotron-padding-y) * 2);
 21    }
 22  }
 23  
 24  .jumbotron p:last-child {
 25    margin-bottom: 0;
 26  }
 27  
 28  .jumbotron-heading {
 29    font-weight: 300;
 30    color: var(--title);
 31  }
 32  
 33  .jumbotron .container {
 34    max-width: 40rem;
 35  }
 36  
 37  footer {
 38    padding-top: 3rem;
 39    padding-bottom: 3rem;
 40  }
 41  
 42  footer p {
 43    margin-bottom: .25rem;
 44  }
 45  
 46  .box-shadow { box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05); }
 47
 48  .entry-disabled {
 49    opacity: 0.25
 50  }
 51  
 52#main_container, .jumbotron {
 53	padding: 20px!important;
 54}
 55
 56.card-controls {
 57  flex-direction: row-reverse;
 58}
 59
 60body {
 61  background-color: var(--background0);
 62  color: var(--text);
 63  color-scheme: dark;
 64}
 65
 66.lead {
 67  color: var(--text);
 68}
 69
 70.btn-go {
 71  color: var(--text);
 72  background-color: var(--accent);
 73  border-color: var(--accent);
 74}
 75
 76a {
 77  color: var(--text);
 78  cursor: pointer;
 79}
 80a:hover {
 81  color: var(--text);
 82}
 83
 84.my-card{
 85  background-color: var(--background1);
 86}
 87
 88#opacity_range {
 89  accent-color: var(--accent);
 90}
 91
 92#month_input {
 93  background-color: var(--background0);
 94  color: var(--text);
 95  color-scheme: dark;
 96}
 97
 98.text-row {
 99  margin-top: 20px;
100}