/* Smartphones (portrait and landscape) ----------- */
@media 
screen 
and (min-width: 320px) 
and (max-width: 1200px),       
screen
and (min-device-width : 320px) 
and (max-device-width : 1200px){  
  #header
  {
    text-align: center;
    position: relative;
    top: auto;
    left: auto;
    height: auto;
    margin-bottom: 15px;
  }

  #logo
  {
    display: inline-block;
    float: none;
  }

  #menu-trigger
  {
  text-decoration: none;
  display: block;
  color: #fff;
  font-size: 20px;
  font-weight: 600;
  width: auto;
  background: #000;
  text-transform: uppercase;
  width: 100%;
  text-align: center;
  outline: none;
  margin-top: -25px;
  padding: 8px 0;
  z-index: 999;
  position: relative;
  }
  
  #menu-trigger i
  {
  font-size: 20px;
  font-weight: 400;
  margin: 0 0 0 10px;
  }

  #index #heading, #heading
  {
    height: auto;
    margin-top: 0;
    padding: 0 0 25px 0;
  }

  #heading-cover
  {
    width: 100%;
    background: rgba(255,255,255,0.6);
  }

  #heading-content h2
  {
    font-size: 17px;
    line-height: 22px;
    margin-bottom: 25px;
  }

  #heading-content h2 span
  {
    font-size: 60px;
    line-height: 50px;
  }

  #heading-content .button
  {
    padding: 10px 30px;
  }

  #contact-form-box
  {
    padding: 20px;
  }

  .contact-form-box-content h5
  {
    font-size: 20px;
    line-height: 28px;
    margin-bottom: 30px;
  }

  .contact-form-box-content h5 span
  {
    font-size: 60px;
    line-height: 50px;
  }

  .contact-form-box-content p:last-child
  {
    margin-bottom: 30px;
  }

  .counter
  {
    margin-bottom: 50px;
  }

  #page-title, .heading
  {
    font-size: 20px;
    line-height: 28px;
  }

  #page-title span, .heading span
  {
    font-size: 50px;
    line-height: 40px;
  }

  .grid-sizer, .grid-item
  {
    width: 100%;
  }

  .gutter-sizer
  {
    width: 0;
  }

  @media 
  screen 
  and (min-width: 767x) 
  and (max-width: 1200px),       
  screen
  and (min-device-width : 767px) 
  and (max-device-width : 1200px){  
    .grid-sizer, .grid-item
    {
      width: 24.25%;
    }

    .gutter-sizer
    {
      width: 1%;
    }

    .col-service:nth-child(2n+3)
    {
      clear: left;
    }
  }

  .col-job
  {
    margin-bottom: 30px;
  }

  h3
  {
    font-size: 26px;
  }

}