client/src/styles/_rules.sass

   1 figure.diagram-container
   2   margin: 15px 0 15px 0
   3   text-align: center
   4   width: 100%
   5   display: block
   6   .diagram
   7     display: block
   8     width: 50%
   9     margin-left: auto
  10     margin-right: auto
  11     @media screen and (max-width: 630px)
  12       width: 75%
  13   .diag12
  14     float: left
  15     width: 42%
  16     margin: 0 2% 0 6%
  17     @media screen and (max-width: 630px)
  18       width: 49%
  19       margin: 0 1% 0 0
  20   .diag22
  21     float: left
  22     width: 42%
  23     margin: 0 6% 0 2%
  24     @media screen and (max-width: 630px)
  25       width: 49%
  26       margin: 0 0 0 1%
  27   figcaption
  28     display: block
  29     clear: both
  30     padding-top: 5px
  31     font-size: 0.8em
  32
  33 p.boxed
  34   background-color: #FFCC66
  35   padding: 5px
  36
  37 .bigfont
  38   font-size: 1.2em
  39
  40 .bold
  41   font-weight: bold
  42
  43 .stageDelimiter
  44   color: purple
  45
  46 // To show (new) pieces, and/or there values...
  47 figure.showPieces > img
  48   width: 50px
  49
  50 figure.showPieces > figcaption
  51   color: #6C6C6C
  52
  53 .section-title
  54   padding: 0
  55
  56 .section-title > h4
  57   padding: 5px
  58
  59 ol, ul:not(.browser-default)
  60   padding-left: 20px
  61
  62 ul:not(.browser-default)
  63   margin-top: 5px
  64
  65 ul:not(.browser-default) > li
  66   list-style-type: disc
  67
  68 table.rules
  69   margin: 15px auto
  70
  71 .italic
  72   font-style: italic
  73
  74 img.img-center
  75   display: block
  76   margin: 0 auto 15px auto