.wrapper {
  position: static !important;
  background-image: url("../img/background.jpg");
  background-position: right bottom;
  background-repeat: no-repeat; }

.cell {
  margin: 0;
  padding: 0;
  position: relative;
  float: left;
  overflow: hidden; }
  .cell.site-title {
    background-color: #6dc6ff; }
    @media only screen and (min-width: 320px) {
      .cell.site-title {
        visibility: hidden;
        height: 80px; } }
    @media only screen and (min-width: 768px) {
      .cell.site-title {
        visibility: visible;
        height: 400px; } }
  .cell.block-introduction {
    background-color: #6dc6ff;
    padding: 20px;
    position: relative; }
    .cell.block-introduction:before {
      vertical-align: middle;
      content: '';
      display: inline-block;
      height: 100%;
      margin-right: -0.25%; }
    .cell.block-introduction .text {
      display: inline-block;
      color: #222;
      vertical-align: bottom;
      width: 99%;
      font-size: 1.75em; }
    @media only screen and (min-width: 320px) {
      .cell.block-introduction {
        height: auto; } }
    @media only screen and (min-width: 768px) {
      .cell.block-introduction {
        height: 400px; } }

.work {
  background-color: #111; }
  .work img {
    filter: alpha(opacity=20);
    -khtml-opacity: 0.2;
    -webkit-opacity: 0.2;
    -moz-opacity: 0.2;
    opacity: 0.2;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";
    -webkit-transition: opacity 200ms ease-in-out;
    -moz-transition: opacity 200ms ease-in-out;
    transition: opacity 200ms ease-in-out;
    position: relative;
    z-index: 0; }
  .work .description {
    -webkit-transition: background-color 200ms ease-in-out;
    -moz-transition: background-color 200ms ease-in-out;
    transition: background-color 200ms ease-in-out;
    position: absolute;
    top: 0;
    z-index: 1;
    padding: 20px;
    width: 100%;
    background-color: rgba(238, 238, 238, 0);
    color: #999; }
    .work .description p {
      margin: 0;
      padding: 0;
      position: relative; }
    .work .description .work-title {
      -webkit-transition: color 200ms ease-in-out;
      -moz-transition: color 200ms ease-in-out;
      transition: color 200ms ease-in-out;
      color: #eee; }
    .work .description .work-subtitle {
      -webkit-transition: color 200ms ease-in-out;
      -moz-transition: color 200ms ease-in-out;
      transition: color 200ms ease-in-out;
      color: #999;
      font-size: 0.83125em; }
  .work:hover {
    cursor: pointer; }
    .work:hover img {
      filter: alpha(opacity=100);
      -khtml-opacity: 1;
      -webkit-opacity: 1;
      -moz-opacity: 1;
      opacity: 1;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }
    .work:hover .description {
      background-color: #eeeeee; }
    .work:hover .work-title {
      color: #222; }
    .work:hover .work-subtitle {
      color: #444; }

@media only screen and (min-width: 768px) {
  .no-js .wrapper {
    padding-top: 80px; }
  .no-js .header {
    top: 0; } }

@media only screen and (min-width: 768px) {
  .js.no-csstransitions .wrapper, .js .no-csstransforms .wrapper {
    padding-top: 80px; }
  .js.no-csstransitions .header, .js .no-csstransforms .header {
    top: 0; } }