/* Basic & Fonts {{{*/
a {
	text-decoration: none;
	color: #37abc8;
}
body {
	background-color: #eee;
	margin: 0;
	padding: 0;
}
h1, h2, h3, h4, h5, h6, p, body {
	font-family: Helvetica, arial, freesans, clean, sans-serif;
}
#try textarea, #try-error {
	font-family: Consolas, Monaco, "Courier New", monospace;
}
#try-error { font-size: 12px; }
pre {
	border: 1px solid #ccc;
	font-size: 12px;
}
.tabs a { font-size: 13px; }
.logo {
  width: 80px;
  height: 80px;
  float: left;
  padding-right: 1em;
}
.title {
  font-size: 26px;
  display: inline-block;
}
#github {
  padding-left: 1em;
}
header p, #toc-label, #github, #toc li { font-size: 14px }
section { margin-bottom: -0.9em; }
section h2 { padding-top: 1.1em; }
header a, footer a {
  color: #37abc8
}
/*}}}*/

/* Header {{{*/
header {
	background: #2b2b2b;
	color: #fff;
	padding: 0.5em 11%;
}
header p { margin-top: -1em; }
.logo { font-weight: bolder; }
.logo #github { margin-left: 1em; }
/*}}}*/

/* Footer {{{*/
footer {
  background: #2b2b2b;
  color: #fff;
  padding: 0.5em 11%;
}
footer p { margin: auto; }
/*}}}*/

/* TOC {{{*/
#toc {
	position: fixed;
	background-color: #2b2b2b;
	margin: 0;
	padding: 0;
	width: 19em;
	top: 0;
	right: -18.8em;
	height: 100%;
	overflow-y: hidden;
	transition-property: right;
	transition-duration: 0.4s;
	transition-delay: 0.1s;
}

#toc:hover, #toc.hover {
	right: 0;
	overflow-x: hidden;
	overflow-y: scroll;
}

#toc-label {
  display: inline-block;
	background: #37abc8;
	position: fixed;
	right: 0;
	top: 3.2em;
	transition-property: opacity;
	transition-duration: 0.6s;
	transition-delay: 0.3s;
	opacity: 0.97;
	z-index: 100;
}

#toc-label a {
  color: white;
  display: block;
	width: 5.5em;
	padding: 0.3em 0 0.3em 1em;
}

#toc-label.no-touch:hover {
	opacity: 0.32;
}

#toc ul {
	margin: 0;
	padding: 0;
	border-left: 3px solid #37abc8;
	transition-property: right;
	transition-duration: 0.4s;
	transition-delay: 0.1s;
}

#toc li { display: block; }

#toc li a {
	display: block;
	color: #37abc8;
	border-bottom: 1px solid #4a4a4a;
	padding: 0.6em 1em;
	transition-property: border-bottom,background-color;
	transition-duration: 0.4s;
	transition-delay: 0.1s;
}
#toc li a:hover {
	border-bottom: 2px solid #9a9a9a;
	background-color: #4a4a4a;
}

/*}}}*/

/* Try It Out {{{*/
#try-bar {
	bottom: 0;
	margin: 0;
	position: fixed;
	height: 35px;
}

#run-link.hide { display: none; }
#try-link, #run-link {
	display: inline-block;
	background: #37abc8;
	color: #fff;
	margin: 0 0.6em 0 0;
	padding: 0.5em;
	width: 4.3em;
	transition-property: background-color,color;
	transition-duration: 0.3s;
}

#try-link:hover, #run-link:hover {
	color: #37abc8;
	background: #fff;
}

/* Try textareas {{{*/
#try {
	display: none;
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 19.2em;
	padding: 0;
	background: rgba(43, 43, 43, 0.85);
	width: auto;
	height: auto;
}

#try .code {
	cursor: text;
	position: absolute;
	top: 35px;
	bottom: 15px;
	left: 15px;
	right: 15px;
}

#try-input-template-wrap, #try-output-template-wrap {
	width: 47%;
	margin-left: 5px;
	right: 50%;
	float: left;
	border-right: 1px solid #fff;
}

#try-input-template-wrap.error, #try-input-data-wrap.error {
	border-right: 1px solid #f19;
}

#try-input-template-wrap, #try-input-data-wrap, #try-output-template-wrap, #try-output-result-wrap {
	position: absolute;
	top: 10px;
	left: 10px;
	height: 42%;
	margin-bottom: 0;
}

#try-input-template, #try-input-data, #try-output-template, #try-output-result {
	background: #000;
	background: rgba(0,0,0,0);
	outline: none;
	margin: 5px 0 20px;
	padding-left: 5px;
	width: 95%;
	height: 100%;
	border: 0;
	resize: none;
	overflow-y: auto;
}
#try-input-template, #try-input-data { color: #37abc8; }

#try-input-data-wrap, #try-output-result-wrap {
	left: 50%;
	width: 49%;
}

#try-output-template-wrap, #try-output-result-wrap {
  top: 50%;
}

#try-output-template, #try-output-result {
	color: #def;
}

#try-examples {
  color: white;
  position: absolute;
  top: 10px;
  left: 15px;
}
/*}}}*/
/*}}}*/

/* Code Tabs {{{*/
.gs-code, .gs-tab, pre[class="language-gorillascript"] {
	background-color: #eff;
}
.js-code, .js-tab, pre[class="language-javascript"] {
	background-color: #ffe;
}
.gs-code, .js-code {
  margin: 0 1.6em 1.6em;
  padding: 1em;
	font-family: Consolas, Monaco, 'Andale Mono', monospace;
	white-space: pre;
}
.tabs {
	padding: 0;
	margin: 1em 1.6em 0;
}
.tabs li {
	display: inline-block;
	line-height: normal;
}

.tabs li a {
	color: #fff;
	background: #37abc8;
	border: none;
	display: inline-block;
	padding: 3px 1em;
	transition-property: background-color,color;
	transition-duration: 0.3s;
}
.tabs li a:hover {
	color: #37abc8;
	background: #fff;
}
.tabs .active a {
	color: #37abc8;
	background: none;
	border: solid #37abc8;
	border-width: 1px 1px 0 1px;
}
/*}}}*/

/* Main {{{*/
#container {
	width: auto;
	margin: 0 11%;
	padding-bottom: 4%;
}

#container p {
	line-height: 1.6em;
	margin: 0.5em 1.6em;
}

section li {
	line-height: 1.9em;
}

#container section li code {
	padding: 0.1em 0.4em;
}
#container section p code {
	padding: 0 0.4em;
}
#container section li code, #container section p code {
	font-size: 16px;
	background: #ddd;
	color: #707070;
}
#container section li tt, #container section p tt {
  font-size: 16px;
  border: 1px solid #c0c0c0;
	padding: 0 0.2em;
}
#container section button tt {
  font-size: 110%;
  border: none;
}
#container section h2 code {
	font-size: 1.5em;
	margin: 0 0.2em;
	color: #505050;
	border-bottom: 1px solid;
}
/*}}}*/

/*embedded IRC iframe{{{*/
#irc-iframe {
  width: 100%;
  height: 400px;
}
/*}}}*/

.comma-list {
  display: inline-block;
  list-style: none;
}

.comma-list li {
  display: inline;
}
.comma-list li a:after {
  content: ", ";
}
.comma-list li:last-child a:after {
  content: "";
}