h2 {
  margin-top: 50px;
}
.images {
  position: relative;
}
.images li img {
  width: 100%;
  height: auto;
}
.images li a {
  display: block;
  overflow: hidden;
  height: 100%;
}





@media (max-width: 959px) {

  .images {
    margin: 0 -8px;
  }
  .images li {
    width: 25%;
    float: left;
  }
  .images li a {
    margin: 8px;
  }
  .images li:nth-child(1), .images li:nth-child(4), .images li:nth-child(7) {
    width: 50%;
  }
  .images li:nth-child(4) {
    float: right;
  }

}




@media (min-width: 720px) {
}





@media (min-width: 720px) and (max-width: 959px) {
}





@media (min-width: 960px) {

  .images {
    height: 228px;
    padding-bottom: 16px;
  }
  .images li {
    position: absolute;
    width: 106px;
    height: 106px;
    top: 0;
  }

  .images:nth-child(1) li:nth-child(1) {
    width: 228px;
    left: 0;
  }
  .images:nth-child(1) li:nth-child(1) img {
    margin-top: -53px;
  }
  .images:nth-child(1) li:nth-child(2) {
    top: 122px;
    left: 0;
  }
  .images:nth-child(1) li:nth-child(3) {
    top: 122px;
    left: 122px;
  }
  .images:nth-child(1) li:nth-child(4) {
    width: 228px;
    height: 228px;
    left: 244px;
  }
  .images:nth-child(1) li:nth-child(5) {
    left: 488px;
  }
  .images:nth-child(1) li:nth-child(6) {
    top: 122px;
    left: 488px;
  }
  .images:nth-child(1) li:nth-child(7) {
    left: 610px;
  }
  .images:nth-child(1) li:nth-child(8) {
    top: 122px;
    left: 610px;
  }
  .images:nth-child(1) li:nth-child(9) {
    left: 732px;
  }
  .images:nth-child(1) li:nth-child(10) {
    left: 854px;
  }
  .images:nth-child(1) li:nth-child(11) {
    width: 228px;
    top: 122px;
    left: 732px;
  }
  .images:nth-child(1) li:nth-child(11) img {
    margin-top: -53px;
  }


  .images:nth-child(2) li:nth-child(1) {
    left: 0;
  }
  .images:nth-child(2) li:nth-child(2) {
    left: 122px;
  }
  .images:nth-child(2) li:nth-child(3) {
    top: 122px;
    left: 0;
  }
  .images:nth-child(2) li:nth-child(4) {
    top: 122px;
    left: 122px;
  }
  .images:nth-child(2) li:nth-child(5) {
    width: 228px;
    left: 244px;
  }
  .images:nth-child(2) li:nth-child(5) img {
    margin-top: -53px;
  }
  .images:nth-child(2) li:nth-child(6) {
    top: 122px;
    left: 244px;
  }
  .images:nth-child(2) li:nth-child(7) {
    top: 122px;
    left: 366px;
  }
  .images:nth-child(2) li:nth-child(8) {
    left: 488px;
  }
  .images:nth-child(2) li:nth-child(9) {
    left: 610px;
  }
  .images:nth-child(2) li:nth-child(10) {
    width: 228px;
    top: 122px;
    left: 488px;
  }
  .images:nth-child(2) li:nth-child(10) img {
    margin-top: -53px;
  }
  .images:nth-child(2) li:nth-child(11) {
    width: 228px;
    height: 228px;
    left: 732px;
  }

  .images:nth-child(3) li:nth-child(1) {
    width: 228px;
    left: 0;
  }
  .images:nth-child(3) li:nth-child(1) img {
    margin-top: -53px;
  }
  .images:nth-child(3) li:nth-child(2) {
    top: 122px;
    left: 0;
  }
  .images:nth-child(3) li:nth-child(3) {
    top: 122px;
    left: 122px;
  }
  .images:nth-child(3) li:nth-child(4) {
    left: 244px;
  }
  .images:nth-child(3) li:nth-child(5) {
    left: 366px;
  }
  .images:nth-child(3) li:nth-child(6) {
    width: 228px;
    top: 122px;
    left: 244px;
  }
  .images:nth-child(3) li:nth-child(6) img {
    margin-top: -53px;
  }
  .images:nth-child(3) li:nth-child(7) {
    width: 228px;
    height: 228px;
    left: 488px;
  }
  .images:nth-child(3) li:nth-child(8) {
    left: 732px;
  }
  .images:nth-child(3) li:nth-child(9) {
    left: 854px;
  }
  .images:nth-child(3) li:nth-child(10) {
    top: 122px;
    left: 732px;
  }
  .images:nth-child(3) li:nth-child(11) {
    top: 122px;
    left: 854px;
  }

}