@font-face {
  font-family: 'Cantarell';
  src: local("Cantarell"), local("Cantarell Regular"), url(../fonts/Cantarell-Regular.otf);
}

@font-face {
  font-family: 'Cantarell';
  font-weight: bold;
  src: local("Cantarell"), local("Cantarell Bold"), local("Cantarell-Bold"), url(../fonts/Cantarell-Bold.otf);
}

/* Layout ------------------------------------------------------------------*/
/*
.page {
  @include container;
  @include susy-grid-background;
}

h1 {
  @include span-columns(3);
}
*/
/* line 28, ../sass/screen.scss */
body {
  margin: 0;
  font: 12pt/18pt Cantarell, OpenSans, Sans-Serif;
  background-color: #f1f2f1;
}

/* line 36, ../sass/screen.scss */
.splash {
  background-image: -moz-linear-gradient(top, #183661, #2c64b3);
  background-image: -webkit-linear-gradient(top, #183661, #2c64b3);
  background-image: -o-linear-gradient(top, #183661, #2c64b3);
  background-image: -ms-linear-gradient(top, #183661, #2c64b3);
  background-image: linear-gradient(top, #183661, #2c64b3);
  border-top: 3px solid #0e1f38;
  border-bottom: 3px solid #0e1f38;
}
/* line 41, ../sass/screen.scss */
.splash .featured {
  width: 90%;
  margin: 0 auto;
  color: white;
  font-weight: bold;
  text-shadow: 0 2px 1px black;
  -moz-text-shadow: 0 2px 1px black;
  -webkit-text-shadow: 0 2px 1px black;
}
/* line 47, ../sass/screen.scss */
.splash .featured .app {
  position: relative;
  display: inline-block;
  width: 32%;
  height: 24pt;
  padding-top: 190px;
  overflow: hidden;
  background-repeat: no-repeat;
  background-position: 20% 50%;
  background-size: 150%;
  cursor: pointer;
}
/* line 58, ../sass/screen.scss */
.splash .featured .app .label {
  position: absolute;
  bottom: 20px;
  left: 20px;
  font-size: 120%;
}

/* line 68, ../sass/screen.scss */
#firefox {
  background-image: url("../images/featured-firefox.png");
}

/* line 68, ../sass/screen.scss */
#gimp {
  background-image: url("../images/featured-gimp.png");
}

/* line 68, ../sass/screen.scss */
#xchat {
  background-image: url("../images/featured-xchat.png");
}

/* line 73, ../sass/screen.scss */
h1, h2, h3 {
  color: #555555;
}

/* line 77, ../sass/screen.scss */
h1 {
  fons-size: 140%;
}

/* line 78, ../sass/screen.scss */
h2 {
  font-size: 130%;
}

/* line 79, ../sass/screen.scss */
h3 {
  font-size: 120%;
}

/* line 81, ../sass/screen.scss */
.container {
  *zoom: 1;
  max-width: 32em;
  _width: 32em;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1em;
  padding-right: 1em;
  /* @include susy-grid-background; */
}
/* line 38, ../../../../../../.gem/ruby/1.9.1/gems/compass-0.13.alpha.0/frameworks/compass/stylesheets/compass/utilities/general/_clearfix.scss */
.container:after {
  content: "";
  display: table;
  clear: both;
}
/* line 86, ../sass/screen.scss */
.container h1, .container h2, .container h3 {
  width: 100%;
  float: left;
  margin-right: 3.125%;
  display: inline;
}
/* line 90, ../sass/screen.scss */
.container .tile {
  position: relative;
  width: 31.25%;
  float: left;
  margin-right: 3.125%;
  display: inline;
  padding: 0;
}
/* line 94, ../sass/screen.scss */
.container .tile:nth-child(3n) {
  width: 31.25%;
  float: right;
  margin-right: 0;
  #margin-left: -1em;
  display: inline;
}
/* line 97, ../sass/screen.scss */
.container .tile img {
  display: block;
  padding: 0;
  margin: 0 auto;
  width: 100%;
  height: auto;
  max-width: 171px;
  cursor: pointer;
}
/* line 106, ../sass/screen.scss */
.container .tile .label {
  display: block;
  font-size: 90%;
  text-align: center;
}
/* line 111, ../sass/screen.scss */
.container .tile span {
  position: absolute;
  right: 0;
  top: 60%;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -o-box-sizing: border-box;
  font-size: 80%;
  color: #fff;
  background-color: #6d99d1;
  padding: 0.2em 1em;
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5);
  -moz-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5);
  -webkit-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5);
}
/* line 124, ../sass/screen.scss */
.container ul.menu {
  width: 100%;
  float: right;
  margin-right: 0;
  #margin-left: -1em;
  display: inline;
}
/* line 126, ../sass/screen.scss */
.container ul.menu li {
  cursor: pointer;
  width: 31.25%;
  float: left;
  margin-right: 3.125%;
  display: inline;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -o-box-sizing: border-box;
  padding: .5em;
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border: 1px solid #f1f2f1;
  margin-bottom: 6px;
}
/* line 129, ../sass/screen.scss */
.container ul.menu li:nth-child(3n) {
  width: 31.25%;
  float: right;
  margin-right: 0;
  #margin-left: -1em;
  display: inline;
}
/* line 137, ../sass/screen.scss */
.container ul.menu li:hover {
  border: 1px solid #bcc1bc;
  background-image: -moz-linear-gradient(top, #fefefe, #e4e6e4);
  background-image: -webkit-linear-gradient(top, #fefefe, #e4e6e4);
  background-image: -o-linear-gradient(top, #fefefe, #e4e6e4);
  background-image: -ms-linear-gradient(top, #fefefe, #e4e6e4);
  background-image: linear-gradient(top, #fefefe, #e4e6e4);
  box-shadow: 0 1px 0 white;
  -moz-box-shadow: 0 1px 0 white;
  -webkit-box-shadow: 0 1px 0 white;
}
/* line 142, ../sass/screen.scss */
.container ul.menu li:active {
  border: 1px solid #a2a8a2;
  background-image: -moz-linear-gradient(top, #c9cdc9, #e4e6e4);
  background-image: -webkit-linear-gradient(top, #c9cdc9, #e4e6e4);
  background-image: -o-linear-gradient(top, #c9cdc9, #e4e6e4);
  background-image: -ms-linear-gradient(top, #c9cdc9, #e4e6e4);
  background-image: linear-gradient(top, #c9cdc9, #e4e6e4);
}
/* line 146, ../sass/screen.scss */
.container ul.menu li a {
  display: block;
  color: #3465a4;
  text-align: center;
}
@media (min-width: 50em) {
  /* line 81, ../sass/screen.scss */
  .container {
    *zoom: 1;
    max-width: 65em;
    _width: 65em;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1em;
    padding-right: 1em;
    /* @include susy-grid-background; */
  }
  /* line 38, ../../../../../../.gem/ruby/1.9.1/gems/compass-0.13.alpha.0/frameworks/compass/stylesheets/compass/utilities/general/_clearfix.scss */
  .container:after {
    content: "";
    display: table;
    clear: both;
  }
  /* line 160, ../sass/screen.scss */
  .container .tile {
    width: 15.385%;
    float: left;
    margin-right: 1.538%;
    display: inline;
  }
  /* line 162, ../sass/screen.scss */
  .container .tile:nth-child(3n) {
    width: 15.385%;
    float: left;
    margin-right: 1.538%;
    display: inline;
  }
  /* line 163, ../sass/screen.scss */
  .container .tile:last-child {
    width: 15.385%;
    float: right;
    margin-right: 0;
    #margin-left: -1em;
    display: inline;
  }
  /* line 166, ../sass/screen.scss */
  .container h1, .container h2, .container h3 {
    width: 100%;
    float: left;
    margin-right: 1.538%;
    display: inline;
  }
  /* line 169, ../sass/screen.scss */
  .container ul.menu {
    width: 100%;
    float: right;
    margin-right: 0;
    #margin-left: -1em;
    display: inline;
  }
  /* line 171, ../sass/screen.scss */
  .container ul.menu li {
    width: 32.308%;
    float: left;
    margin-right: 1.538%;
    display: inline;
  }
  /* line 174, ../sass/screen.scss */
  .container ul.menu li:nth-child(3n) {
    width: 32.308%;
    float: right;
    margin-right: 0;
    #margin-left: -1em;
    display: inline;
  }
}

/* line 182, ../sass/screen.scss */
.page {
  *zoom: 1;
  max-width: 47em;
  _width: 47em;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1em;
  padding-right: 1em;
  /* @include susy-grid-background; */
}
/* line 38, ../../../../../../.gem/ruby/1.9.1/gems/compass-0.13.alpha.0/frameworks/compass/stylesheets/compass/utilities/general/_clearfix.scss */
.page:after {
  content: "";
  display: table;
  clear: both;
}
/* line 189, ../sass/screen.scss */
.page #header, .page #meta, .page #screenshots, .page #buttons {
  width: 100%;
  float: right;
  margin-right: 0;
  #margin-left: -1em;
  display: inline;
  margin-bottom: 6px;
}
/* line 194, ../sass/screen.scss */
.page #header .icon {
  width: 14.894%;
  float: left;
  margin-right: 2.128%;
  display: inline;
  margin: 19px 0 19px;
}
/* line 198, ../sass/screen.scss */
.page #header .name {
  width: 65.957%;
  float: left;
  margin-right: 2.128%;
  display: inline;
}
/* line 201, ../sass/screen.scss */
.page #header .rating {
  width: 14.894%;
  float: right;
  margin-right: 0;
  #margin-left: -1em;
  display: inline;
  position: relative;
}
/* line 204, ../sass/screen.scss */
.page #header .rating img {
  display: block;
  position: absolute;
  top: 19px;
  right: 0;
}
/* line 211, ../sass/screen.scss */
.page #gallery {
  width: 100%;
  float: left;
  margin-right: 2.128%;
  display: inline;
}
/* line 213, ../sass/screen.scss */
.page #gallery img {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -o-box-sizing: border-box;
  width: 100%;
}
@media (min-width: 50em) {
  /* line 211, ../sass/screen.scss */
  .page #gallery {
    width: 82.979%;
    float: left;
    margin-right: 2.128%;
    display: inline;
  }
  /* line 219, ../sass/screen.scss */
  .page #gallery img {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    width: 100%;
  }
}
/* line 225, ../sass/screen.scss */
.page #thumbnails {
  width: 100%;
  float: right;
  margin-right: 0;
  #margin-left: -1em;
  display: inline;
}
/* line 228, ../sass/screen.scss */
.page #thumbnails a {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -o-box-sizing: border-box;
  width: 14.894%;
  float: left;
  margin-right: 2.128%;
  display: inline;
  border: 2px solid transparent;
  cursor: pointer;
}
/* line 233, ../sass/screen.scss */
.page #thumbnails a.selected {
  border: 2px solid #3465a4;
}
/* line 236, ../sass/screen.scss */
.page #thumbnails a img {
  width: 100%;
  float: right;
  margin-right: 0;
  #margin-left: -1em;
  display: inline;
  width: 100%;
}
@media (min-width: 50em) {
  /* line 225, ../sass/screen.scss */
  .page #thumbnails {
    width: 14.894%;
    float: right;
    margin-right: 0;
    #margin-left: -1em;
    display: inline;
  }
  /* line 244, ../sass/screen.scss */
  .page #thumbnails a {
    width: 100%;
    float: right;
    margin-right: 0;
    #margin-left: -1em;
    display: inline;
  }
}
/* line 249, ../sass/screen.scss */
.page #meta dl {
  width: 48.936%;
  float: left;
  margin-right: 2.128%;
  display: inline;
  font-size: 90%;
}
/* line 252, ../sass/screen.scss */
.page #meta dl:last-child {
  width: 48.936%;
  float: right;
  margin-right: 0;
  #margin-left: -1em;
  display: inline;
}
/* line 255, ../sass/screen.scss */
.page #meta dl dt {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -o-box-sizing: border-box;
  display: inline-block;
  margin: 0 3% 0 0;
  width: 47.8%;
  text-align: right;
  color: #888888;
}
/* line 264, ../sass/screen.scss */
.page #meta dl dd {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -o-box-sizing: border-box;
  display: inline-block;
  margin: 0;
  width: 46%;
}
/* line 271, ../sass/screen.scss */
.page #buttons button {
  width: 31.915%;
  float: left;
  margin-right: 2.128%;
  display: inline;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -o-box-sizing: border-box;
  padding: .5em;
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border: 1px solid #bcc1bc;
  background-image: -moz-linear-gradient(top, #fefefe, #e4e6e4);
  background-image: -webkit-linear-gradient(top, #fefefe, #e4e6e4);
  background-image: -o-linear-gradient(top, #fefefe, #e4e6e4);
  background-image: -ms-linear-gradient(top, #fefefe, #e4e6e4);
  background-image: linear-gradient(top, #fefefe, #e4e6e4);
  box-shadow: 0 1px 0 white;
  -moz-box-shadow: 0 1px 0 white;
  -webkit-box-shadow: 0 1px 0 white;
  margin-bottom: 4em;
  cursor: pointer;
}
/* line 281, ../sass/screen.scss */
.page #buttons button:hover {
  border: 1px solid #3a71b7;
  background-image: -moz-linear-gradient(top, white, #e4e6e4);
  background-image: -webkit-linear-gradient(top, white, #e4e6e4);
  background-image: -o-linear-gradient(top, white, #e4e6e4);
  background-image: -ms-linear-gradient(top, white, #e4e6e4);
  background-image: linear-gradient(top, #ffffff, #e4e6e4);
}
/* line 285, ../sass/screen.scss */
.page #buttons button:active {
  border: 1px solid #a2a8a2;
  background-image: -moz-linear-gradient(top, #c9cdc9, #e4e6e4);
  background-image: -webkit-linear-gradient(top, #c9cdc9, #e4e6e4);
  background-image: -o-linear-gradient(top, #c9cdc9, #e4e6e4);
  background-image: -ms-linear-gradient(top, #c9cdc9, #e4e6e4);
  background-image: linear-gradient(top, #c9cdc9, #e4e6e4);
}
/* line 289, ../sass/screen.scss */
.page #buttons button:last-child {
  width: 31.915%;
  float: right;
  margin-right: 0;
  #margin-left: -1em;
  display: inline;
}