div.homepagecontainer
{
  min-height: 30em;
}


div.hptilecontainer
{
    margin-left: 0%; /* 4% */
    margin-right: 0%; /* 4% */
    width: 100%; /* was 90% */
}

div.hptilefixed /* ok down to 1153px width */
{
  /*  position: relative; */
    display: inline-block;
    margin: 0%;
    width: 24.79%; /* 24.79 */
}
img.hptile
{
    margin: 0%;
    width: 100%;
    z-index: 1;
}
picture.hptile
{
    margin: 0%;
    width: 100%;
    z-index: 1;
    border-radius: 0; /* 12px; */
}
p.hptile
{
    position: absolute;
    bottom: 0.5em;
    left: 0.0em; /* .5 */
    right: 0.0em;
    text-align: center;
    font-size: 1.5em;
    font-family: "Open Sans Condensed", "Futura", "Calibri", sans-serif;
    color: white;
    background: rgba(0,0,0,0.7);
    z-index: 0;
}
p.hptile-small
{
    position: absolute;
    bottom: 0.5em;
    left: 0.5em;
    right: 0.5em;
    font-size: 1em;
    font-family: "Futura", "Calibri", sans-serif;
    color: white;
    background: rgba(0,0,0,0.7);
    z-index: 0;
}
a.hptile
{
    position: relative;
    display: inline-block;
    text-decoration: none;
}

/* ************************ MODS FOR SMALL SCREENS ************************ */

@media (max-width: 1439px)
{
  div.hptilefixed /* ok down to 1013px width */
  {
    /*  position: relative; */
      display: inline-block;
      margin: 0%;
      width: 24.7%; /* 24.79 */
  }
}

@media (max-width: 1012px)
{
  div.hptilefixed /* ok down to 766px width */
  {
    /*  position: relative; */
      display: inline-block;
      margin: 0%;
      width: 24.6%; /* 24.79 */
  }
}

@media (max-width: 800px)
{
  div.hptilefixed /* ok down to 766px width */
  {
    /*  position: relative; */
      display: inline-block;
      margin: 0%;
      width: 49.5%; /* 24.79 */
  }
}

@media (max-width: 750px)
{
    div.hptilecontainer {
        margin: 0%; /* 0, 1%, 0, 1%; */
      }
    div.hptile {
        width: 100%;
    }

    div.hptilefixed
    {
        margin: 0%; /* margin: 1% 4% 1% 4%; */
        width: 100%; /* 95% */
    }

}