| 
									
										
										
										
											2018-11-30 12:27:43 -08:00
										 |  |  | /* Base styles and content styles */ | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | @import 'variables.css'; | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | html { | 
					
						
							|  |  |  |     font-family: Lato, 'Helvetica Neue', 'Arial', sans-serif; | 
					
						
							|  |  |  |     color: var(--fg); | 
					
						
							|  |  |  |     background-color: var(--bg); | 
					
						
							|  |  |  |     text-size-adjust: none; | 
					
						
							|  |  |  |     -webkit-font-smoothing: antialiased; | 
					
						
							|  |  |  |     -moz-osx-font-smoothing: grayscale; | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | body { | 
					
						
							|  |  |  |     margin: 0; | 
					
						
							|  |  |  |     font-size: 1rem; | 
					
						
							|  |  |  |     overflow-x: hidden; | 
					
						
							|  |  |  |     font-family: Lato, 'Helvetica Neue', 'Arial', sans-serif; | 
					
						
							| 
									
										
										
										
											2018-12-27 15:50:39 -08:00
										 |  |  |     font-size: 16px; | 
					
						
							| 
									
										
										
										
											2018-11-30 12:27:43 -08:00
										 |  |  |     font-weight: 300; | 
					
						
							|  |  |  |     -webkit-font-smoothing: antialiased; | 
					
						
							|  |  |  |     -moz-osx-font-smoothing: grayscale; | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | code { | 
					
						
							|  |  |  |     font-family: Consolas, Menlo, Monaco, "Lucida Console", "Liberation Mono", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Courier New", monospace, serif; | 
					
						
							|  |  |  |     font-size: 13px; /* please adjust the ace font size accordingly in editor.js */ | 
					
						
							|  |  |  |     line-height: 1.5; | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | .left { float: left; } | 
					
						
							|  |  |  | .right { float: right; } | 
					
						
							|  |  |  | .hidden { display: none; } | 
					
						
							|  |  |  | .play-button.hidden { display: none; } | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | h1, h2, h3 { margin-top: 2.5em; } | 
					
						
							|  |  |  | h4, h5 { margin-top: 2em; } | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | .header + .header h3, | 
					
						
							|  |  |  | .header + .header h4, | 
					
						
							|  |  |  | .header + .header h5 {  | 
					
						
							|  |  |  |     margin-top: 1em; | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | a.header:target h1:before, | 
					
						
							|  |  |  | a.header:target h2:before, | 
					
						
							|  |  |  | a.header:target h3:before, | 
					
						
							|  |  |  | a.header:target h4:before { | 
					
						
							|  |  |  |     display: inline-block; | 
					
						
							|  |  |  |     content: "»"; | 
					
						
							|  |  |  |     margin-left: -30px; | 
					
						
							|  |  |  |     width: 30px; | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | .page { | 
					
						
							|  |  |  |     outline: 0; | 
					
						
							|  |  |  |     /* padding: 0 var(--page-padding); */ | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | .page-wrapper { | 
					
						
							|  |  |  |     box-sizing: border-box; | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | .js .page-wrapper { | 
					
						
							|  |  |  |     transition: margin-left 0.3s ease, transform 0.3s ease; /* Animation: slide away */ | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | .content { | 
					
						
							|  |  |  |     overflow-y: auto; | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |     padding-bottom: 50px; | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | .content main { | 
					
						
							|  |  |  |     margin-left: auto; | 
					
						
							|  |  |  |     margin-right: auto; | 
					
						
							|  |  |  |     max-width: var(--content-max-width); | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | .content a:hover { text-decoration: underline; } | 
					
						
							|  |  |  | .content img { max-width: 100%; } | 
					
						
							|  |  |  | .content .header:link, | 
					
						
							|  |  |  | .content .header:visited { | 
					
						
							|  |  |  |     color: var(--fg); | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | .content .header:link, | 
					
						
							|  |  |  | .content .header:visited:hover { | 
					
						
							|  |  |  |     text-decoration: none; | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | table { | 
					
						
							|  |  |  |     margin: 0 auto; | 
					
						
							|  |  |  |     border-collapse: collapse; | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | table td { | 
					
						
							|  |  |  |     padding: 3px 20px; | 
					
						
							|  |  |  |     border: 1px var(--table-border-color) solid; | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | table thead { | 
					
						
							|  |  |  |     background: var(--table-header-bg); | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | table thead td { | 
					
						
							|  |  |  |     font-weight: 700; | 
					
						
							|  |  |  |     border: none; | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | table thead tr { | 
					
						
							|  |  |  |     border: 1px var(--table-header-bg) solid; | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | /* Alternate background colors for rows */ | 
					
						
							|  |  |  | table tbody tr:nth-child(2n) { | 
					
						
							|  |  |  |     background: var(--table-alternate-bg); | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | blockquote { | 
					
						
							|  |  |  |     margin: 20px 0; | 
					
						
							|  |  |  |     padding: 0 20px; | 
					
						
							|  |  |  |     color: var(--fg); | 
					
						
							|  |  |  |     background-color: var(--quote-bg); | 
					
						
							|  |  |  |     border-top: .1em solid var(--quote-border); | 
					
						
							|  |  |  |     border-bottom: .1em solid var(--quote-border); | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | :not(.footnote-definition) + .footnote-definition, | 
					
						
							|  |  |  | .footnote-definition + :not(.footnote-definition) { | 
					
						
							|  |  |  |     margin-top: 2em; | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | .footnote-definition { | 
					
						
							|  |  |  |     font-size: 0.9em; | 
					
						
							|  |  |  |     margin: 0.5em 0; | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | .footnote-definition p { | 
					
						
							|  |  |  |     display: inline; | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | .tooltiptext { | 
					
						
							|  |  |  |     position: absolute; | 
					
						
							|  |  |  |     visibility: hidden; | 
					
						
							|  |  |  |     color: #fff; | 
					
						
							|  |  |  |     background-color: #333; | 
					
						
							|  |  |  |     transform: translateX(-50%); /* Center by moving tooltip 50% of its width left */ | 
					
						
							|  |  |  |     left: -8px; /* Half of the width of the icon */ | 
					
						
							|  |  |  |     top: -35px; | 
					
						
							|  |  |  |     font-size: 0.8em; | 
					
						
							|  |  |  |     text-align: center; | 
					
						
							|  |  |  |     border-radius: 6px; | 
					
						
							|  |  |  |     padding: 5px 8px; | 
					
						
							|  |  |  |     margin: 5px; | 
					
						
							|  |  |  |     z-index: 1000; | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | .tooltipped .tooltiptext { | 
					
						
							|  |  |  |     visibility: visible; | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | *:focus, | 
					
						
							|  |  |  | *:active, | 
					
						
							|  |  |  | *:hover { | 
					
						
							|  |  |  |   outline: none; | 
					
						
							| 
									
										
										
										
											2019-06-06 12:48:40 -07:00
										 |  |  | } |