html,body,h1,h2,.result pre,.documentation p {margin:0}
html,body {font-size:100%}
.content {margin:1.55rem 0 0 0}
.compile {
	margin:2.5rem auto;
	padding:0.5rem 0.85rem;
	width:5.5rem;
	line-height:1rem;
	border: solid 0.12rem #4fbb4f;
	background:#b1e9b1;
	color:#000;
	border-radius:0.5rem;
	box-shadow:0.1rem 0.1rem 0.6rem #888888
}
.menu p,.menu .menu-inner,.demo,.documentation .documentation-inner {margin:0 auto}
.menu hr {margin:1.5rem auto;border-top:none;border-bottom:solid 0.12rem #000}
.menu .must-read img {margin:0 auto 2rem auto;width:356px}
.documentation .documentation-inner {margin-left:3rem}
.documentation h2 a {margin:0 0 0 -2.2rem}
.documentation h3 a {margin:0 0 0 -1.75rem}
.documentation h4 {margin:0.9rem 0;padding: 0 0.9rem 0 0}
.documentation h4 a {margin:0 0 0 1.5rem}
html,body,.result pre {padding:0}
h1 {padding: 60px 0 30px 0;
  font-size: 60px;
}
h2 {
  padding: 30px 0 15px 0;
}
.editor-wrapper, .result {
  padding: 10px;
  height: 500px;
  border: dotted 1px #C9C9C9;
  background: solid 1px #C9C9C9;
}
.social {
  padding: 20px;
  background: #ECECEC;
}
.menu {
  padding: 60px 0 60px 0;
  background: #575757;
  border-top: solid 1px #FFF;
  border-bottom: solid 1px #6C6C6C;
}
.demo-selector select {
  padding: 6px 8px 6px 6px;
  border: solid 2px #C2C2C2;
  border-radius: 10px;
  min-width: 240px;
}
.documentation p {
  padding: 0 20px 0 0;
}
html,body {min-height:100vh;max-width:100vw}
#editor {
  max-width:100%;
  min-height:100%;
}
.editor-wrapper, .result, .menu section {
  width: 50%;
}
.documentation .desc {
  width: 30%;
}
.documentation .code {
  width:70%
}
html, body, .demo-selector select {
  font-family: Georgia;
}
html, body, .compile {
  font-size:1rem;
}
h2, .menu p, .documentation h4 {
  font-size: 30px;
}
.result, .menu p a small, .demo-selector select, .documentation p {
  font-size: 18px;
}
.compile small {
  font-size: 11px;
  line-height: 11px;
}
.documentation h2 {
  font-size: 50px;
  line-height: 50px;
  border-bottom: solid 4px #FFF;
}
.documentation h3 {
  font-size: 40px;
  border-bottom: dotted 2px #666666;
}
html, body, .documentation p {
  line-height: 24px;
}
.menu p {
  line-height: 30px;
}
.menu .must-read p {
  line-height: 20px;
}
.documentation h3, .documentation h4 {
  line-height: 40px;
}
h1, h2, .centered, .compile, .social, .demo-selector {
  text-align: center;
}
.documentation h2, .documentation h3, .documentation h4 {
  text-align: left;
}
h1, h2, .documentation h3, .documentation h4 {
  font-weight: normal;
}
.clear, .menu .menu-inner:after {
  clear: both;
}
.compile:hover {
  background: #74DF68;
}
.documentation {
  background: #353535;
  padding-bottom: 100px;
  padding-top: 100px;
}
.editor-wrapper, .result, .menu section, .documentation .desc, .documentation .code {
  float: left;
}
.editor-wrapper, .result, .social, .menu, .menu section, .documentation, .documentation h4, .documentation .code {
  box-sizing: border-box;
}
.editor-wrapper, .result, .social, .menu, .documentation, .documentation h4, .documentation .code {
  -moz-box-sizing: border-box;
}
.result {
  pre: [object Object];
}
.result pre {
  word-wrap: break-word;
}
.compile, .menu p a, .menu hr, .menu .must-read img {
  display: block;
}
.menu .menu-inner:after {
  display: table;
  content: "";
}
.documentation h2 a, .documentation h3 a, .documentation h4, .documentation h4 a {
  display: inline-block;
}
.compile, .menu p a, .documentation h2 a, .documentation h3 a, .documentation h4 a, .documentation .menu a:hover {
  text-decoration: none;
}
.menu, .menu p a, .documentation, .documentation p a, .documentation .desc a, .documentation .menu a {
  color: #FFF;
}
.menu p a small {
  color: #cccccc;
}
.documentation h2 a, .documentation h3 a, .documentation h4 a {
  color: #696969;
  margin-right: 10px;
  opacity: 0;
}
.documentation h4, .documentation p {
  color: #8C8C8C;
}
.documentation .documentation-inner section {
  border-bottom: dotted 1px #000;
  margin-top: 20px;
}
.menu p a {
  text-shadow: 1px 1px #000;
}
.menu p a:hover {
  text-shadow: 3px 3px #000;
}
.menu .menu-inner, .documentation .documentation-inner {
  max-width: 950px;
}
.demo {
  max-width: 1200px;
}
.demo-selector, .documentation .documentation-inner section, .documentation h3 {
  padding-bottom: 20px;
}
.documentation h2:hover a, .documentation h3:hover a, .documentation h4:hover a {
  opacity: 1;
}
