.images-grid {
    margin: 0 auto;
}

.images-grid:after {
    content: '';
    display: block;
    clear: both;
}

.grid-sizer, .grid-item {
    padding: 8px;
    width: calc(50%);
}

.grid-item {
    float: left;
    & > div {
        transition: all .3s;

        &:hover {
            margin-top: -5px;
            box-shadow: 15.8px 21.3px 83.8px rgba(0, 0, 0, 0.07), 102px 137px 196px rgba(0, 0, 0, 0.035);
        }
    }
}

@media screen and (min-width: 640px) {
    .grid-sizer, .grid-item {
        width: calc(33.333%);
    }
}

@media screen and (min-width: 768px) {
    .grid-sizer, .grid-item {
        width: calc(25%);
    }
}

@media screen and (min-width: 1024px) {
    .grid-sizer, .grid-item {
        width: calc(20%);
    }
}

@media screen and (min-width: 1280px) {
    .grid-sizer, .grid-item {
        width: calc(12.5%);
    }
}

@media screen and (min-width: 1536px) {
    .grid-sizer, .grid-item {
        width: calc(10%);
    }
}