@font-face {
  font-family:'Bebas';
  font-style:normal;
  font-weight:400;
  src:url(BebasNeue.otf);
}

::selection {
  color: #eee;
  background: #666;
} 
::-moz-selection {
  color: #eee;
  background: #666;
}

html {
  background:#fafafa;
  color:#666;
  font-family:'Rokkitt';
  padding:0;
  margin:0;
}
body {
  padding:0;
  margin:0;
  overflow-x:hidden;
  background:#fafafa;
}

#forkme {
  position:absolute;
  top:28px;
  right:-102px;
  z-index:99;
  width:300px;
  line-height:40px;
  text-align:center;
  background:#666;
  background-image:linear-gradient(top, #777, #555);
  background-image:-webkit-linear-gradient(top, #777, #555);
  background-image:-moz-linear-gradient(top, #777, #555);
  box-shadow:inset 0 0 8px #444;
  -webkit-box-shadow:inset 0 0 8px #444;
  -moz-box-shadow:inset 0 0 8px #444;
  border:2px solid #ccc;
  transform:rotate(45deg);
  -webkit-transform:rotate(45deg);
  -moz-transform:rotate(45deg);
}
#forkme a {
  display:inline-block;
  text-decoration:none;
  color:#fafafa;
  font-size:14px;
  transition:.2s all ease-in-out;
  -webkit-transition:.2s all ease-in-out;
  -moz-transition:.2s all ease-in-out;
}
#forkme:hover a {
  color:#fff;
}
#container {
  z-index:98;
  background:#fff;
  width:60%;
  margin:0 auto 100px auto;
  padding:80px 20px;
  box-shadow:0 0 2px #444, 0 40px 0 #666;
  border-bottom-left-radius:6px;
  border-bottom-right-radius:6px;
  border-left:60px solid #fcfcfc;
  border-bottom:40px solid #666;
}
h1, h2, h3 {
  -webkit-text-stroke:0.1px;
  -webkit-font-smoothing:antialiased;
}
h1 {
  font-size:4em;
  font-family:bebas;
  display:inline-block;
  margin:0;
}
h2.section_title {
  margin:0 0 30px -10px;
  font-family:'PT Sans Narrow';
  cursor:pointer;
  transition:.2s all ease-in-out;
  -webkit-transition:.2s all ease-in-out;
  -moz-transition:.2s all ease-in-out;
}
h2.section_title a {
  text-decoration:none;
  text-transform:uppercase;
  color:#666;
}
h2.section_title a:hover {
  text-decoration:underline;
  color:#888;
}
h3 {
  margin:20px 0;
  font-family:helvetica,arial,sans-serif;
  font-size:16px;
}

p.headline {
  font-style:italic;
  color:#888;
}

ul.feature_list {
  z-index:99;
  list-style-type:none;
  height:40px;
  background:#fff;
  padding:0 0 0 2px;
  margin:40px 0;
  border-top:2px solid #666;
}
ul.sticky {
  position:fixed;
  top:-40px;
  background:#fafafa;
  background-image:linear-gradient(top, #fafafa, #eee);
  background-image:-webkit-linear-gradient(top, #fafafa, #eee);
  background-image:-moz-linear-gradient(top, #fafafa, #eee);
  box-shadow:0 0 6px #666;
  border:4px solid #666;
  border-top:none;
}
ul.sticky li {
  border-radius:0;
  box-shadow:1px 0 0 #666;
  text-shadow:0 1px 0 rgba(255, 255, 255, .7);
}
ul.sticky li.selected {
  background:#888;
  background-image:linear-gradient(top, #888, #666);
  background-image:-webkit-linear-gradient(top, #888, #666);
  background-image:-moz-linear-gradient(top, #888, #666);
}
ul.feature_list li {
  z-index:99;
  height:100%;
  display:inline-block;
  vertical-align:middle;
  line-height:40px;
  padding:0 20px;
  margin:0 0 0 -2px;
  font-size:14px;
  font-family:helvetica,arial,sans-serif;
  cursor:pointer;
  transition:.2s all ease-in-out;
  -webkit-transition:.2s all ease-in-out;
  -moz-transition:.2s all ease-in-out;
  border-bottom-left-radius:2px;
  border-bottom-right-radius:2px;
  text-shadow:none;
  user-select:none;
  -webkit-user-select:none;
  -moz-user-select:none;
  color:#666;
  opacity:.7;
}
ul.feature_list > li:hover {
  opacity:1;
}
ul.feature_list > li.selected {
  background:#666;
  opacity:1;
}
ul.feature_list > li > a {
  display:inline-block;
  text-decoration:none;
  color:#666
}
ul.feature_list > li.selected > a {
  color:#fff;
}

section {
  border-radius:4px;
  padding:20px 40px 10px 20px;
  line-height:1.5em;
}
section.highlight {
  background:#fafafa;
}

section ul {
  list-style-type:disc;
}

section ul > li {
  margin-bottom:2px;
}

section em {
  background:#fafafa;
  font-style:normal;
  font-family:monospace;
  padding:0 2px;
  border-radius:2px;
  box-shadow:inset 0 0 1px #444;
}
section em.code {
  display:block;
  padding:8px;
  margin:20px 0;
}
section ol {
  border-left:2px solid #eee;
  margin:20px 0 20px 8px;
}
section ol li {
  font-size:14px;
}


table {
  border-spacing:0;
  box-shadow:0 0 4px #666;
  line-height:1em;
}
th, td {
  padding:10px;
  text-align:center;
}

th {
  font-size:14px;
  font-weight:normal;
  color:#fafafa;
  background:#666;
  background-image:linear-gradient(top, #777, #555);
  background-image:-webkit-linear-gradient(top, #777, #555);
  background-image:-moz-linear-gradient(top, #777, #555);
  box-shadow:0 0 4px #666, 0 1px 0 #111;
  border-right:1px solid #444;
}

td {
  font-size:14px;
  color:#fefefe;
  font-family:helvetica,arial,sans-serif;
  box-shadow:inset 0 0 2px #666;
}
td.name {
  background:#fafafa;
  color:#666;
  font-family:helvetica,arial,sans-serif;
  font-weight:bold;
  text-align:left;
  width:100px;
  box-shadow:inset 0 0 1px #666;
}
td.name:last-of-type {
  border-bottom:none;
}
td.name:first-of-type {
  border-top:none;
}
td.yes {
  background:#5DAC81;
}
td.no {
  background:#E3916E;
}
td.name a:hover {
  text-decoratioN:underline;
}
td.name a {
  color:#666;
  text-decoration:none;
}
td em {
  background:#666;
  color:#fafafa;
  font-size:10px;
  float:right;
  position:relative;
  top:-6px;
  right:-6px;
  line-height:10px;
  text-shadow:none;
}
td span {
  position:relative;
  left:4px;
}

div.gist-syntax {
  background:#fafafa !important;
}
