/**
 *   Util layout grid classes
 */
.col_1 {
  margin-left: 0%;
  width: 21%; }

.col_2 {
  margin-left: 4%;
  width: 46%; }

.col_3 {
  margin-left: 8%;
  width: 71%; }

.col_4 {
  margin-left: 12%;
  width: 96%; }

/**
 *   General styling
 */
body {
  font-size: 13px; }

h2 {
  font-size: 20px; }

h3 {
  font-size: 16px; }

h4 {
  font-size: 13px; }

.logo {
  bottom: auto;
  float: left;
  height: 150px;
  position: static;
  top: auto; }

/**
 *  top
 */
#top {
  margin-bottom: 60px; }
  #top nav {
    padding-bottom: 0; }
    #top nav p {
      display: inline-block;
      line-height: 80px;
      margin-left: 70px; }

footer {
  height: 120px;
  padding-top: 30px; }

/**
 *   personalPage
 */
.personalPage {
  background: transparent url("../images/personalPageBg.png") no-repeat left top;
  background-size: 50%; }

/**
 *  Grid Page
 */
.grid {
  margin: 0px auto 0 90px; }
  .grid article {
    margin: 40px 5% 0 0;
    width: 30%; }
    .grid article:nth-child(3n) {
      margin-right: 0; }
    .grid article:nth-child(1) {
      margin-top: 0; }
    .grid article:nth-child(2) {
      margin-top: 0; }
    .grid article:nth-child(3) {
      margin-top: 0; }
    .grid article h4 {
      background: transparent;
      color: #1d1d1d;
      padding: 15px 15px 0 15px;
      position: static; }
    .grid article .details {
      border-bottom: 1px solid #999999;
      color: #999999;
      display: block;
      font-size: 12px;
      overflow: hidden; }
      .grid article .details .subtitle {
        margin-bottom: 5px;
        text-transform: uppercase; }
      .grid article .details .tech, .grid article .details .description, .grid article .details .urls {
        display: none; }

/**
 * Item Page
 */
.genericItemPage {
  padding-bottom: 50px;
  margin-top: -60px; }
  .genericItemPage nav {
    font-size: 12px;
    line-height: 80px; }
    .genericItemPage nav a {
      margin-left: 60px; }
      .genericItemPage nav a:first-child {
        margin-left: 10px; }
  .genericItemPage .info {
    width: 35%; }
  .genericItemPage .images {
    margin-left: 3%;
    width: 62%; }
    .genericItemPage .images img {
      margin-bottom: 50px; }

/**
 * contact page
 */
.contactPage {
  margin-left: 90px;
  margin-top: -20px; }
  .contactPage article {
    margin-top: 0; }
  .contactPage form {
    margin-left: 10px;
    padding-bottom: 65px; }
    .contactPage form > div {
      width: 50%; }
    .contactPage form input[type=text] {
      height: 40px;
      line-height: 40px;
      padding: 0 10px; }
    .contactPage form textarea {
      height: 205px;
      width: 100%; }
    .contactPage form .nameWrapper, .contactPage form .emailWrapper, .contactPage form .phoneWrapper {
      clear: left;
      float: left;
      margin-left: -10px; }
    .contactPage form .messageWrapper {
      margin: 0 0 20px 50%; }
    .contactPage form .buttonWrapper {
      text-align: right;
      width: auto; }
    .contactPage form button {
      display: inline;
      width: auto; }