@import url(http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:400,300,200,700);
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300,700,600,800&subset=latin,latin-ext);

@font-face
{
  font-family: 'Pixel Twist';
  font-style: normal;
  font-weight: 400;
  src: local('Pixel Twist'), url(/static/fonts/PixelTwist.ttf) format('truetype');
}

.list-pixel:before
{
  content: ">";
  display: block;
  font-family: Pixel Twist;
  color: #aaa;
  font-size: 28px;
  position: absolute;
  margin: -7px 0 0 -20px;
}

.list-pixel, #footer-credits li
{
  padding-left: 20px;
}

body
{
  padding-top: 40px;
  background: #333;
  font-family: Open Sans, Helvetica Neue, Helvetica, Arial, sans-serif;
  -moz-font-feature-settings: "liga";
  text-rendering: optimizelegibility;
}

h1, h2, h3, h4
{
  font-family: Open Sans, sans-serif;
}

@media (max-width: 768px)
{
  .mbp, .mbp-screen, .social
  {
    display: none;
  }
}

#content
{
  background: #fff;
  min-height: 800px;
}

.jumbotron:first-child
{
  padding: 0;
  background-color: #9955BB;
}

.nav a
{
  font-size: 18px;
  font-weight: 400;
  color: #fff;
  font-family: Yanone Kaffeesatz;
  letter-spacing: 1px;
}

.navbar-inverse
{
  background: #9955BB; /* Deep lilac */
  border-bottom: solid 1px #471859;
}

.navbar-inverse .navbar-nav > .active > a, .navbar-inverse .navbar-nav > .active > a:hover, .navbar-inverse .navbar-nav > .active > a:focus
{
  background: none;
  color: #9955BB;
}

.navbar-inverse .navbar-nav > li > a
{
  color: #fff;
}

.navbar-inverse .navbar-nav > li > a:hover
{
    color: #fff;
}

.hero-container {
  background-color: #EEEEEE;
  color: inherit;
  font-size: 21px;
  font-weight: 200;
  line-height: 2.14286;
  padding: 30px 0;
}

.section {
  background-color: #EEEEEE;
  padding: 30px 0;
}

#footer
{
  background: #323232;
  border-top: 5px solid #9955BB;
  padding-bottom: 0;
  line-height: 2.14286;
}

.navbar-brand
{
  background: transparent url(/static/img/logo.png) no-repeat center center;
  height: 50px;
  width: 150px;
  background-size: 100%;
}

.btn-primary 
{
  background-color: #9955BB;
  border: none;
}

.btn-primary:hover 
{
  background-color: #471859;
}

.container 
{
  max-width: 970px;
}

#footer #footer-top
{
  border-bottom: 1px solid #282828;
}

#copyright
{
  background: #333;
  border-top: 1px solid #3B3B3B;
  font-size: 18px;
  font-weight: 300;
  color: #fff;
  font-family: Yanone Kaffeesatz;
  letter-spacing: 1px;
  padding: 10px 0;
}

#copyright p
{
  margin: 0;
}

.social
{
  margin: 0;
}

.social li
{

}

.social a
{
  display: block;
  color: #fff;
  padding: 8px 0px;
  font-size: 24px;
}

.social a:hover
{
  color: #fff;
}

.carousel {
  height: 300px;
background: -moz-radial-gradient(center, ellipse cover, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0) 100%);
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(255,255,255,0.5)), color-stop(100%,rgba(255,255,255,0)));
background: -webkit-radial-gradient(center, ellipse cover, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
background: -o-radial-gradient(center, ellipse cover, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
background: -ms-radial-gradient(center, ellipse cover, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
background: radial-gradient(ellipse at center, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=1 );
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  z-index: 10;
}

/* Declare heights because of positioning of img element */
.carousel .item {
  height: 300px;
}

.carousel-inner
{
  overflow: visible;
}

.mbp
{
  position: absolute;
  margin: -300px 0 0 400px;
  max-width: 560px;
  z-index: 1;
}

.carousel .mbp-screen
{
  position: absolute;
  margin: -220px 0 0 485px;
  max-height: 245px;
  z-index: 99;
  color: rgba(255, 255, 255, 0.9);
  text-align: center;
}

.download
{
  width: 390px !important;
  font-family: Pixel Twist, monospace; 
}

.download a
{
  color: rgba(255, 255, 255, 0.7);
  text-decoration: none;
  transition: color 0.4s ease;
}

.download a:hover
{
  color: rgba(255, 255, 255, 1);
  text-decoration: none;
}

.download p
{
  font-size: 4em;
  line-height: 1;
}

/** http://static.baboom.com/developers/images/f2861080.particles_down_1200px.png */

.jumbo div
{
  min-height: 460px;
}

.jumbo
{
  background: #323232;
  min-height: 460px;
  padding: 0;
}

.jumbo .background
{
  background: #323232;
  width: 100%;
}

.jumbo .container
{
  padding: 0;
}

.jumbo .container .text
{
  background: transparent url(/static/img/text_mask.png) no-repeat center center;
  z-index: 0;
}

.jumbo .fixed
{
  background: transparent url(/static/img/purple_x.png) repeat center center;
  background-attachment: fixed;
}

.particles {
    background-image: url(/static/img/bugs.png);
    background-repeat: repeat;
}
.particles {
  position: absolute;
  width: 100%;
  margin-top: -460px;
  z-index: 0;
}

.carousel .mbp-screen-gif
{
  margin-top: -155px;
}

.carousel-inner > .item > img {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100%;
  height: 300px;
}

.carousel-bottom
{
  height: 30px;
  background: #9955BB;
}

.carousel-indicators {
    bottom: -45px;
    left: 25%
}

.carousel-text
{
    color: #FFFFFF;
    text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.6);
    padding-top: 30px;
}


.carousel-fade .item {
  opacity: 0;
  -webkit-transition: opacity 0.5s ease-in-out;
  -moz-transition: opacity 0.5s ease-in-out;
  -ms-transition: opacity 0.5s ease-in-out;
  -o-transition: opacity 0.5s ease-in-out;
  transition: opacity 0.5s ease-in-out;
  left: 0 !important;
}

.carousel-fade .active {
  opacity: 1 !important;
}

.carousel-fade .left, .carousel-fade .right {
  opacity: 0 !important;
  -webkit-transition: opacity 0.5s ease-in-out !important;
  -moz-transition: opacity 0.5s ease-in-out !important;
  -ms-transition: opacity 0.5s ease-in-out !important;
  -o-transition: opacity 0.5s ease-in-out !important;
  transition: opacity 0.5s ease-in-out !important;
}

.carousel-fade .carousel-control {
  opacity: 1 !important;
}

.features
{
  margin-top: 50px;
  margin-bottom: 30px;
}

.separator
{
  margin: 30px 0;
  border-top: solid 3px #333;
  border-bottom: solid 1px #999;
  height:6px;
}

.contributors li
{
  margin: 0;
  padding: 0;
}

.contributors img
{
  opacity: 0.5;
  height: 64px;
  width: 64px;
}

.contributors img:hover
{
  transition: opacity 0.4s;
  opacity: 1; 
}

#documentation
{
  padding: 50px 0;  
}

#documentation img
{
  max-width: 100%;  
}

.documentation-post
{
  background: #fff;
  box-shadow: 2px 4px 1px #ccc;
  font-size: 15px;
}

.gray
{
  background: #eee !important;
}

.opacity-half
{
  opacity: 0.5;
}

#footer-top
{
  color: #666;
  font-weight: 300;  
}

.media-object
{
  width: 32px;
  border: 2px solid #666;
  vertical-align: middle;
  margin-right: 10px;
}

#footer-top div h2:first-child 
{
  margin-top: 0;
  font-weight: 300;
  text-transform: uppercase;
}

#footer-top .media
{
  padding: 10px 0;
  border-top: 1px solid #3B3B3B;
  border-bottom: 1px solid #282828;
  margin-top: 0;
}

#footer-top ul li.media:first-child
{
  border-top: 0;
}
#footer-top ul li.media:last-child
{
  border-bottom: 0;
}

#footer-top .media-body
{
  line-height: 1.2em;
  font-size: 12px;
}

#footer-top .media-heading
{
  font-size: 12px;
}

#footer-top a
{
  color: #aaa; 
}

.fullname, .invisible, .username, ._timestamp
{
  display: none;
}

.avatar
{
  float: left;
}

pre{
    background: none repeat scroll 0 0 #FAF8FF;
    border-bottom: 1px solid #CACFC8;
    border-top: 1px solid #CACFC8;
    border-left: 0;
    border-right: 0;
    border-radius: 0;
    color: #333333;
    display: block;
    font-size: 16px;
    line-height: 1.42857;
    margin: 0 0 10px;
    padding: 9.5px;
    word-break: break-all;
    word-wrap: break-word;
}

code
{
  word-break:break-all;
  word-wrap:break-word;
}

/** Highlight JS */

pre code {

}

pre .comment,
pre .template_comment,
pre .javadoc,
pre .comment * {
  color: #800;
}

pre .keyword,
pre .method,
pre .list .title,
pre .clojure .built_in,
pre .nginx .title,
pre .tag .title,
pre .setting .value,
pre .winutils,
pre .tex .command,
pre .http .title,
pre .request,
pre .status {
  color: #008;
}

pre .envvar,
pre .tex .special {
  color: #660;
}

pre .string,
pre .tag .value,
pre .cdata,
pre .filter .argument,
pre .attr_selector,
pre .apache .cbracket,
pre .date,
pre .regexp,
pre .coffeescript .attribute {
  color: #080;
}

pre .sub .identifier,
pre .pi,
pre .tag,
pre .tag .keyword,
pre .decorator,
pre .ini .title,
pre .shebang,
pre .prompt,
pre .hexcolor,
pre .rules .value,
pre .css .value .number,
pre .literal,
pre .symbol,
pre .ruby .symbol .string,
pre .number,
pre .css .function,
pre .clojure .attribute {
  color: #066;
}

pre .class .title,
pre .haskell .type,
pre .smalltalk .class,
pre .javadoctag,
pre .yardoctag,
pre .phpdoc,
pre .typename,
pre .tag .attribute,
pre .doctype,
pre .class .id,
pre .built_in,
pre .setting,
pre .params,
pre .variable,
pre .clojure .title {
  color: #606;
}

pre .css .tag,
pre .rules .property,
pre .pseudo,
pre .subst {
  color: #000;
}

pre .css .class, pre .css .id {
  color: #9B703F;
}

pre .value .important {
  color: #ff7700;
  font-weight: bold;
}

pre .rules .keyword {
  color: #C5AF75;
}

pre .annotation,
pre .apache .sqbracket,
pre .nginx .built_in {
  color: #9B859D;
}

pre .preprocessor,
pre .preprocessor * {
  color: #444;
}

pre .tex .formula {
  background-color: #EEE;
  font-style: italic;
}

pre .diff .header,
pre .chunk {
  color: #808080;
  font-weight: bold;
}

pre .diff .change {
  background-color: #BCCFF9;
}

pre .addition {
  background-color: #BAEEBA;
}

pre .deletion {
  background-color: #FFC8BD;
}

pre .comment .yardoctag {
  font-weight: bold;
}