

/* #Mobile ================================================== */
@media only screen and (max-width: 768px) {
  h1 {
    font-size: 2.2em;
  }
  
  /**** header *****/
  .l-header .top-bar {
    padding: 0;
    margin: 0;
  }
  .top-bar-section {
    float: none;
    margin: 0;
  }
  .top-bar-section .dropdown li.title h5 a {
    color: #444;
  }
  .top-bar-section ul li > a,
  .top-bar-section .dropdown li a {
    padding: 2px 0 2px 15px;
  }
  
  
  
  /********* Blog ********/
  .title-contener {
    width: auto;
    float: left;
  }
  .view-blog.view-display-id-page .node-title {
    font-size: 21px;
  }
  .view-blog.view-display-id-page .body,
  .node-blog.view-mode-full .body {
    clear: both;
  }
  .view-blog.view-display-id-page .date,
  .node-blog.view-mode-full .date {
    margin-right: 4px;
  }
  
  .view-id-projects.view-display-id-block_2 .view-header {
    float: none;
    width: auto;
  }
  .view-id-projects.view-display-id-block_2 .view-content {
    float: none;
    width: auto;
  }
  .block-content .view-projects .details {
    background-size: cover;
  }
  
  
  .footer-container {
    background-size: cover; 
  }
}

/* #Mobile (Landscape) and Tablet
================================================== */
@media only screen and (min-width: 481px) and (max-width: 768px) {
  .row, 
  .contain-to-grid,
  .contain-to-grid .top-bar {
    max-width: 34.287em;
    margin: 0 auto;
  }
}