body{
  font-weight: 100;
  background: #eee;
  font-size: 18px;
}

h1, h2 {
    font-family: 'Lato', Helvetica, Arial, sans-serif;
    margin-bottom: 0;
    line-height: 27px;
}

h1 {
  font-weight: 100;
  font-size: 40px;
  background: #666;
  color: #fff;
  padding: 20px;
  margin: 50px 0;
  line-height: 120%;
}

h2 {
  font-size: 30px;
  font-weight: 700;
  transition: all 0.7s;
  -webkit-transition: all 0.7s;
  -moz-transition: all 0.7s;
  line-height: 110%;
}

.block{
  padding: 20px;
  margin-bottom: 30px;
  color: #fff;
  position: relative;
  height: 180px;
}
.block:hover{
  cursor: pointer;
}
.block:hover h2{
  opacity: 0.6;
  transition: all 0.7s;
  -webkit-transition: all 0.7s;
  -moz-transition: all 0.7s;
}
.description{
  position: absolute;
  bottom: 0px;
  padding-right: 20px;
  opacity: 0;
  line-height: 120%;
  transition: all 0.7s;
  -webkit-transition: all 0.7s;
  -moz-transition: all 0.7s;
}
.block:hover .description{
  opacity: 1;
  transition: all 0.7s;
  -webkit-transition: all 0.7s;
  -moz-transition: all 0.7s;
}

.block.emulator, .block.emulator:hover, .block.android, .block.android:hover,
.block.navpal, .block.navpal:hover, .block.techcafe, .block.techcafe:hover,
.block.sabt, .block.sabt:hover, .block.about, .block.about:hover{
  transition: all 0.7s;
  -webkit-transition: all 0.7s;
  -moz-transition: all 0.7s;
}

.block.navpal{
  background-color: #457ec5;
}
.block.navpal:hover{
  background-color: #5f94d5;
}

.block.android{
  background-color: #6bb931;
}
.block.android:hover{
  background-color: #83ca4f;
}

.block.emulator{
  background-color: #dc902e;
}
.block.emulator:hover{
  background-color: #e6a24a;
}

.block.sabt{
  background-color: #3eb5bc;
}
.block.sabt:hover{
  background-color: #59c6cd;
}

.block.techcafe{
  background-color: #cd5050;
}
.block.techcafe:hover{
  background-color: #db6868;
}

.block.about{
  background-color: #bbb;
}
.block.about:hover{
  background-color: #c2c1c0;
}

/* Media Query:; All Mobile & Tablet Sizes */
  @media only screen and (max-width: 959px) {
    .description{
      opacity: 1;
    }
    body{
      font-weight: 300;
    }
    h1{
      margin-top: 30px;
    }
  }
  /* Tablet Portrait size to standard 960 (devices and browsers) */
  @media only screen and (min-width: 768px) and (max-width: 959px) {
    .block{
      height: 220px;
    }
  }