/* styles for page headers */

#mobile-title {display:none;}

/* general mobile breakpoint  */

@media only screen and (max-width: 970px) {

  /* stuff to control featured images and title */

  #ifp > header {
    box-sizing: border-box;
    width:100%;
    padding: 0px 20px;
    min-height:auto;
  }

  #ifp > header img {
    width:100% !important;
  }

  #ifp > header .img img {
    width:100% !important;
  }

  #ifp > header.with_image {
    margin-bottom:20px;
  }

  #ifp > header.with_image h1 {
    font-size:13vw;
    top:0px;
    left:30px;
    line-height:normal;
  }

  #ifp > header h1 {
    font-size:14vw;
    top:10px;
    line-height:normal;
  }

  #mobile-title {
    box-sizing: border-box;
    display:block;
    text-align:left;
    padding: 0px 20px;
    }

}


/* very small screens */

@media only screen and (max-width: 350px) {

  #ifp > header {
    padding:0px 10px;
  }

  #ifp > header.with_image h1 {
    left:20px;
  }

}