html,
body {
font-family: 'Buenard', serif;
font-size: 16px;
line-height: 1.33;
margin: 0;
padding: 0;
color: #555;
text-align: justify;
}
code {
font-family: "Monaco", monospace;
font-size: 80%;
}
textarea {
width: 100%;
font-family: "Monaco", "Lucida Console", monospace;
}
a:link {
text-decoration: underline;
color: #447fae;
}
a:visited {
color: #447fae;
}
a:hover {
text-decoration: none;
}
a.button { 
-moz-box-shadow: inset 0px 1px 0px 0px #bbdaf7;
-webkit-box-shadow: inset 0px 1px 0px 0px #bbdaf7;
-o-box-shadow: inset 0px 1px 0px 0px #bbdaf7;
-ms-box-shadow: inset 0px 1px 0px 0px #bbdaf7;
box-shadow: inset 0px 1px 0px 0px #bbdaf7;
background: #57c1f2;
background: -webkit-linear-gradient(top, #57c1f2 0%, #447fae 100%);
background: -moz-linear-gradient(top, #57c1f2 0%, #447fae 100%);
background: -o-linear-gradient(top, #57c1f2 0%, #447fae 100%);
background: -ms-linear-gradient(top, #57c1f2 0%, #447fae 100%);
background: linear-gradient(top, #57c1f2 0%, #447fae 100%);
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
-o-border-radius: 6px;
-ms-border-radius: 6px;
border-radius: 6px;
border:1px solid #84bbf3;
display:inline-block;
color:#ffffff;
font-size:15px;
font-weight:bold;
padding:12px 31px;
text-decoration:none;
text-shadow:1px 1px 0px #54accc;
}
aside.note {
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-o-border-radius: 10px;
-ms-border-radius: 10px;
border-radius: 10px;
float: right;
padding: 20px;
margin: -20px 0 20px 20px;
background: #fff;
width: 400px;
}
aside.note h1 {
margin: 0 0 20px 0;
padding: 0;
}
.clear {
clear: both;
}
.line {
display: block;
width: 960px;
margin: 50px auto 100px;
padding: 0;
}
.line::after {
content: ""; 
display: block;
clear: both;
}
.line .line {
width: auto;
margin: 0 -10px;
}
.line .grid-1,
.line .grid-2,
.line .grid-3,
.line .grid-4,
.line .grid-5,
.line .grid-6,
.line .grid-7,
.line .grid-8,
.line .grid-9,
.line .grid-10,
.line .grid-11,
.line .grid-12 {
display: block;
float: left;
margin-left: 10px;
margin-right: 10px;
padding: 0;
}
.line /*
* width: (content-width + margin) * n - margin
*      = (60 + 20) * n - 20
* ruby -e '(1..12).each do |n| puts ".grid-%d \x7b width: %dpx \x7d" % [n,
.line 80 * n - 20] end'
*/
.grid-1 { width: 60px 
}
.line .grid-2 { width: 140px 
}
.line .grid-3 { width: 220px 
}
.line .grid-4 { width: 300px 
}
.line .grid-5 { width: 380px 
}
.line .grid-6 { width: 460px 
}
.line .grid-7 { width: 540px 
}
.line .grid-8 { width: 620px 
}
.line .grid-9 { width: 700px 
}
.line .grid-10 { width: 780px 
}
.line .grid-11 { width: 860px 
}
.line .grid-12 { width: 940px 
}
ul,
ol {
}
ul li,
ol li {
}
ul li h1,
ol li h1 {
font-size: 100%;
}
ul li h1 a:link,
ol li h1 a:link {
text-decoration: none;
}
dl {
}
dl dt {
font-weight: bold;
}
input.button {
font-family: 'Buenard', serif;
padding: 10px 40px;
border: none;
font-size: 18px;
color: #fff;
text-decoration: none;
text-shadow: -1px -1px 0px #246f8e;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
-o-border-radius: 8px;
-ms-border-radius: 8px;
border-radius: 8px;
-moz-box-shadow: inset -1px -1px 5px 0px rgba(0, 0, 0, 0.3);
-webkit-box-shadow: inset -1px -1px 5px 0px rgba(0, 0, 0, 0.3);
-o-box-shadow: inset -1px -1px 5px 0px rgba(0, 0, 0, 0.3);
-ms-box-shadow: inset -1px -1px 5px 0px rgba(0, 0, 0, 0.3);
box-shadow: inset -1px -1px 5px 0px rgba(0, 0, 0, 0.3);
background: #649fce;
background: -webkit-linear-gradient(top, #649fce 0%, #447fae 100%);
background: -moz-linear-gradient(top, #649fce 0%, #447fae 100%);
background: -o-linear-gradient(top, #649fce 0%, #447fae 100%);
background: -ms-linear-gradient(top, #649fce 0%, #447fae 100%);
background: linear-gradient(top, #649fce 0%, #447fae 100%);
border: 1px solid #fff;
}
input.button:hover {
-moz-box-shadow: inset 0px 0px 5px 0px rgba(0, 0, 0, 0.3);
-webkit-box-shadow: inset 0px 0px 5px 0px rgba(0, 0, 0, 0.3);
-o-box-shadow: inset 0px 0px 5px 0px rgba(0, 0, 0, 0.3);
-ms-box-shadow: inset 0px 0px 5px 0px rgba(0, 0, 0, 0.3);
box-shadow: inset 0px 0px 5px 0px rgba(0, 0, 0, 0.3);
background: #333;
background: -webkit-linear-gradient(top, #333 0%, #444 100%);
background: -moz-linear-gradient(top, #333 0%, #444 100%);
background: -o-linear-gradient(top, #333 0%, #444 100%);
background: -ms-linear-gradient(top, #333 0%, #444 100%);
background: linear-gradient(top, #333 0%, #444 100%);
text-shadow: none;
}
pre {
font-family: "Monaco", "Lucida Console", monospace;
background: #333;
color: #fff;
padding: 1em;
font-size: 14px;
opacity: 0.9;
overflow: hidden;
-moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
-webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
-o-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
-ms-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
-moz-box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.8);
-webkit-box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.8);
-o-box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.8);
-ms-box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.8);
box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.8);
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-o-border-radius: 10px;
-ms-border-radius: 10px;
border-radius: 10px;
}
pre .Comment { color: #87d7d7; 
}
pre .Type { color: #afaf5f; font-weight: bold; 
}
pre .Special { color: #ffd7af; 
}
pre .Statement { color: #87d7af; font-weight: bold; 
}
pre .Constant { color: #d7875f; 
}
pre .Identifier { color: #5f8787; 
}
pre .PreProc { color: #d75f5f; 
}
pre.runnable {
position: relative;
min-height: 50px;
}
pre.runnable input.button {
position: absolute;
top: 10px;
right: 10px;
}
pre.runnable pre.output {
position: absolute;
top: 0;
right: 0;
left: 50%;
z-index: 99;
max-height: 80%;
overflow: auto;
margin: 0;
background: #000;
font-size: 14px;
opacity: 0.8;
-moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
-webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
-o-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
-ms-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
}
.em {
font-weight: bold;
color: #990000;
}
h1,
h2,
h3,
h4,
h5,
h6 {
color: #333;
font-family: 'Buenard', serif;
padding: 70px 0 20px;
}
.issues {
}
.issues .issue {
color: #888;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
-o-border-radius: 3px;
-ms-border-radius: 3px;
border-radius: 3px;
-moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
-webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
-o-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
-ms-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
padding: 10px;
font-size: 12px;
margin: 0 0 10px;
background: #fff;
position: relative;
}
.issues .issue .number {
position: absolute;
top: 0;
right: 10px;
font-weight: bold;
font-size: 30px;
color: #ccc;
}
.issues .issue .title {
color: #333;
font-weight: bold;
text-decoration: none;
}
.issues .issue .author {
color: #000;
}
.issues .issue .author img {
margin: 5px 5px -3px 0;
}
.contributors {
}
.contributors .contributor {
display: inline-block;
padding: 10px 10px 10px 0;
text-decoration: none;
color: #333;
}
.contributors .contributor:link {
text-decoration: none;
}
.contributors .contributor img {
margin: 5px 5px -3px 0;
}
#top {
font-size: 34px;
text-align: center;
padding: 2em 0;
}
#top h1 {
font-weight: normal;
}
#top h1 a {
text-decoration: none;
}
#top .description {
}
#global-navigation {
font-size: 100%;
padding: 0;
text-align: center;
margin: 0;
height: 70px;
}
#global-navigation #global-navigation-inner {
padding: 5px 0;
width: 100%;
margin: 0;
background: #fff;
z-index: 230;
}
#global-navigation #global-navigation-inner a {
display: inline-block;
padding: 0;
margin: 5px;;
padding: 5px 10px;
text-decoration: none;
background: #efefef;
}
#global-navigation #global-navigation-inner a:hover,
#global-navigation #global-navigation-inner .active {
background: #333;
color: #fff;
}
#global-navigation #global-navigation-inner ul {
display: block;
padding: 0;
margin: 0;
}
#global-navigation #global-navigation-inner ul li {
display: inline-block;
padding: 0;
margin: 0;
}
#global-navigation #global-navigation-inner ul li .submenu {
display: none;
position: absolute;
left: 0;
width: 100%;
padding: 0;
z-index: 100;
}
#global-navigation #global-navigation-inner ul li .submenu .submenu-inner {
width: 920px;
margin: 0 auto;
padding: 10px;
background: #fff;
-moz-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.5);
-webkit-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.5);
-o-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.5);
-ms-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.5);
box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.5);
text-align: left;
font-size: 80%;
}
#global-navigation #global-navigation-inner ul li:hover .submenu {
display: block;
}
#global-navigation #global-navigation-inner ul li.top {
display: none;
}
#global-navigation #global-navigation-inner.fixed {
position: fixed;
top: 0;
-moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.5);
-webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.5);
-o-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.5);
-ms-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.5);
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.5);
}
#global-navigation #global-navigation-inner.fixed ul {
position: relative;
width: 955px;
margin: 0 auto;
padding: 0 5px 0 0;
text-align: right;
}
#global-navigation #global-navigation-inner.fixed ul li.top {
position: absolute;
left: -5px;
font-size: 120%;
margin-top: -3px;
margin-right: 50px;
display: inline-block;
}
#global-navigation #global-navigation-inner.fixed ul li.top a {
background: transparent;
color: #000;
}
#global-navigation #global-navigation-inner.fixed ul li.top .sub {
font-size: 70%;
color: #666;
}
#content {
background: #efefef;
}
#content #content-inner {
margin: 0 auto;
padding: 0;
}
#download {
font-size: 14px;
}
#download ul li {
display: block; 
text-align: center;
position: relative;
}
#download ul li h1 {
margin: 0;
padding: 0;
font-weight: bold;
font-size: 100%;
color: #fff;
}
#download ul li a {
display: block;
margin: 10px 0 10px;
padding: 15px 10px;
height: 90px;
overflow: hidden;
color: #fff;
text-decoration: none;
text-shadow: -1px -1px 0px #246f8e;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
-o-border-radius: 8px;
-ms-border-radius: 8px;
border-radius: 8px;
-moz-box-shadow: inset -1px -1px 5px 0px rgba(0, 0, 0, 0.3);
-webkit-box-shadow: inset -1px -1px 5px 0px rgba(0, 0, 0, 0.3);
-o-box-shadow: inset -1px -1px 5px 0px rgba(0, 0, 0, 0.3);
-ms-box-shadow: inset -1px -1px 5px 0px rgba(0, 0, 0, 0.3);
box-shadow: inset -1px -1px 5px 0px rgba(0, 0, 0, 0.3);
background: #649fce;
background: -webkit-linear-gradient(top, #649fce 0%, #447fae 100%);
background: -moz-linear-gradient(top, #649fce 0%, #447fae 100%);
background: -o-linear-gradient(top, #649fce 0%, #447fae 100%);
background: -ms-linear-gradient(top, #649fce 0%, #447fae 100%);
background: linear-gradient(top, #649fce 0%, #447fae 100%);
border:1px solid #fff;
}
#download ul li a:hover {
-moz-box-shadow: inset 0px 0px 5px 0px rgba(0, 0, 0, 0.3);
-webkit-box-shadow: inset 0px 0px 5px 0px rgba(0, 0, 0, 0.3);
-o-box-shadow: inset 0px 0px 5px 0px rgba(0, 0, 0, 0.3);
-ms-box-shadow: inset 0px 0px 5px 0px rgba(0, 0, 0, 0.3);
box-shadow: inset 0px 0px 5px 0px rgba(0, 0, 0, 0.3);
background: #333;
background: -webkit-linear-gradient(top, #333 0%, #444 100%);
background: -moz-linear-gradient(top, #333 0%, #444 100%);
background: -o-linear-gradient(top, #333 0%, #444 100%);
background: -ms-linear-gradient(top, #333 0%, #444 100%);
background: linear-gradient(top, #333 0%, #444 100%);
text-shadow: none;
}
#behavior {
}
#behavior figure {
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-o-border-radius: 10px;
-ms-border-radius: 10px;
border-radius: 10px;
float: right;
padding: 10px;
margin: 0 0 20px 20px;
background: #fff;
}
#behavior figure img {
max-width:  440px;
}
#supported {
font-size: 14px;
}
#supported a:link {
text-decoration: none;
}
#supported a:hover {
text-decoration: underline;
}
#supported h1 {
margin: 10px 0;
padding: 20px 0 0;
}
#supported h1 a {
color: #000;
}
.contributors {
margin: 10px -3px;
}
.contributors .contributor {
display: inline-block;
padding: 5px;
margin: 5px 5px 5px 5px;
background: #fff;
color: #333;
height: 34px;
line-height: 34px;
width: 135px;
-moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
-webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
-o-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
-ms-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
-o-border-radius: 3px;
-ms-border-radius: 3px;
border-radius: 3px;
}
.contributors .contributor img {
margin: 5px;
float: left;
}
#global-footer {
text-align: center;
padding: 5em 0;
}
#global-footer .copyright {
}
#global-footer .powered {
}