+@import users
+
html, *
font-family: "Open Sans", Arial, sans-serif
--back-color: #f2f2f2
- --a-link-color: #0039e6
+ --a-link-color: blue
+ --a-visited-color: blue
body
padding: 0
min-width: 320px
+.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
+
+#settings, #contactForm
+ max-width: 767px
+ @media screen and (max-width: 767px)
+ max-width: 100vw
+
+#emailSent
+ color: blue
+ display: none
+
+footer
+ height: 77px
+ background-color: #000033
+ div
+ line-height: 77px
+ a
+ margin: 0 10px 0 0
+ display: inline-block
+ &:visited, &:link
+ color: white
+ p
+ margin: 0 0 0 10px
+ display: inline-block
+ color: white
+ text-decoration: underline
+ @media screen and (max-width: 767px)
+ height: 43px
+ div
+ line-height: 43px
+
+a
+ text-decoration: underline
+
.text-center
text-align: center
.emphasis
font-style: italic
+.clickable
+ cursor: pointer
+
+.clearer
+ clear: both
+
.red
color: #cc3300
.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
-
-// TODO: unused
-// Jump lines only if screen is large enough
-.conditional-jump
- display: block
-@media screen and (max-width: 767px)
- .conditional-jump
- display: inline
+[type="checkbox"].modal+div .card.small-modal
+ max-width: 320px
+[type="checkbox"].modal+div .card.big-modal
+ max-width: 90vw