public/stylesheets/layout.sass

   1 html, *
   2   font-family: "Open Sans", Arial, sans-serif
   3   --back-color: #f2f2f2
   4   --a-link-color: blue
   5   --a-visited-color: blue
   6
   7 body
   8   padding: 0
   9   min-width: 320px
  10
  11 .container
  12   padding: 0
  13   overflow: hidden
  14
  15 .row
  16   div
  17     padding: 0
  18     .section-content
  19       *
  20         margin-left: 0
  21         margin-right: 0
  22       @media screen and (max-width: 767px)
  23         padding: 0 5px
  24
  25 @media screen and (max-width: 767px)
  26   .button-group
  27     flex-direction: row
  28     button:not(:first-child)
  29       border-left: 1px solid var(--button-group-border-color)
  30       border-top: 0
  31
  32 a
  33   text-decoration: underline
  34
  35 .text-center
  36   text-align: center
  37
  38 .smallpad
  39   padding: 5px
  40
  41 .emphasis
  42   font-style: italic
  43
  44 .clickable
  45   cursor: pointer
  46
  47 .clearer
  48   clear: both
  49
  50 .red
  51   color: #cc3300
  52
  53 .purple
  54   color: purple
  55
  56 .smallfont
  57   font-size: 0.8em
  58
  59 .bigfont
  60   font-size: 1.2em
  61
  62 .bold
  63   font-weight: bold
  64
  65 [type="checkbox"].modal+div .card
  66   max-width: 767px
  67   max-height: 100vh
  68 [type="checkbox"].modal+div .card.small-modal
  69   max-width: 320px
  70 [type="checkbox"].modal+div .card.big-modal
  71   max-width: 90vw