.diamonds {
    text-align: center;
    overflow: visible;
    white-space: nowrap;
    display: inline-block;
}

.diamond-row-wrap {
    text-align: center;
    position: relative;
    float: left;
    clear: both;
}
.diamond-row-upper, .diamond-row-lower {
    overflow: visible;
    clear: both;
    width: 100%;
}
.diamond-row-lower {
    position: absolute;
    bottom: 0;
}
    .diamond-row-lower .diamond-box {
        margin-left: 64.644660941%; /* 1 - 1 / sqrt(2) / 2 */
        margin-top: 64.644660941%;
    }

.diamond-box-wrap {
    float: left;
    width: 250px; /* Size of diamonds */
    height: 250px;
}

.diamond-box {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;

    overflow: hidden;
    
    position: relative;
    z-index: 1;
    
    width: 70.710678118%; /* x = sqrt(x^2 / 2) = 1 / sqrt(2) = 0.70710678118 */
    height: 70.710678118%;
    margin: 14.644660941%;
    
    border: 1px solid transparent;
}

.diamond-box-inner {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);

    -webkit-transform-origin: center center;
    -moz-transform-origin: center center;
    -ms-transform-origin: center center;
    transform-origin: center center;
    
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    
    width: 141.421356237%; /* sqrt(2) */
    height: 141.421356237%;
    margin: -20.7106781185% 0 0 -20.7106781185%; /* (1 - sqrt(2)) / 2 */
}

.diamonds a.item{
    background-size: cover;                  
    background-repeat:   no-repeat;
    background-position: center center;    
    display:inline-block;
    height: 250px;
    width: 250px;
    color: #FFF;
}

.diamonds a.item .potms-meta{
    height:250px;
    display: block;
    position:relative;
}

.diamonds a.item .potms-meta span{
    display:none;
    text-align:center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index:10;
    color: #FFF;
}

.diamonds a.item .potms-meta .overlay {
    position: fixed;
    display: none;
    height: 100%;
    width: 100%;
    background-color: #000;
    opacity: 50%;
    cursor: pointer;
    z-index:5;
}

.diamonds a.item .potms-meta.show-title span{
    display:inline-block;
    text-wrap: wrap;
}

.diamondswrap .diamonds{
    min-width: 100%!important;
    max-width: 100%!important;
}

#potms-filters a.button{
   margin-right: 1.25rem;
   width: 18%;
}
#potms-filters a.button:active{
    background: none;
    color: #900;
    border-color: #900;
}

#potms-filters a.button.invert{
    background: none;
    color: #900;
    border-color: #900;
}

#default-grid, #alum-grid, #faculty-grid, #staff-grid, #student-grid{
    display: none;
}

div.section#grid .layout{
    min-height:250px;
}

@media screen and (max-width: 550px) {
  .diamonds a.item .potms-meta{
    height:175px;
    font-size: 0.875rem;
  }
  .diamonds a.item{
    height: 175px;
    width: 175px;
  }
  .diamond-box-wrap {
    width: 175px!important; /* Size of diamonds */
    height: 175px!important;
  }
  #potms-filters a.button{
       width: 42%;
  }
}