html, *
- font-size: 18px
font-family: "Open Sans", Arial, sans-serif
+ --back-color: #f2f2f2
+ --a-link-color: blue
+ --a-visited-color: blue
body
padding: 0
- background-color: #f2f2f2
- //min-width: 240px
+ min-width: 320px
+ margin-bottom: 10px
-@media screen and (min-width: 800px)
- .card
- max-width: 600px
+.container
+ padding: 0
+ overflow: hidden
+
+.row
+ div
+ padding: 0
+ .section-content
+ *
+ margin-left: auto
+ margin-right: auto
+ max-width: 767px
+ figure.diagram-container
+ max-width: 1000px
+ @media screen and (max-width: 767px)
+ max-width: 100%
+ padding: 0 5px
+
+@media screen and (max-width: 767px)
+ .button-group
+ flex-direction: row
+ button:not(:first-child)
+ border-left: 1px solid var(--button-group-border-color)
+ border-top: 0
a
- color: #00B7FF
+ text-decoration: underline
.text-center
text-align: center
.smallpad
padding: 5px
+
+.emphasis
+ font-style: italic
+
+.clickable
+ cursor: pointer
+
+.clearer
+ clear: both
+
+.red
+ color: #cc3300
+
+.purple
+ color: purple
+
+.smallfont
+ font-size: 0.8em
+
+.bigfont
+ font-size: 1.2em
+
+.bold
+ font-weight: bold
+
+[type="checkbox"].modal+div .card
+ max-width: 767px
+ max-height: 100vh
+[type="checkbox"].modal+div .card.small-modal
+ max-width: 320px
+[type="checkbox"].modal+div .card.big-modal
+ max-width: 90vw