/* Tablet Layout: 768px. */

@media only screen and (min-width: 769px) and (max-width: 1199px) {

.hover_effects_li {

  width: 33% !important;
}

.ih-item.circle {

  height: 200px !important;
  width: 200px !important;
}

.ih-item.circle .img {
  height: 200px !important;
  width: 200px !important;
}


.ih-item.square {

  height: 200px !important;
  width: 200px !important;
}

.ih-item.square .img {
  height: 200px !important;
  width: 200px !important;
}

.square .img > img {
  height: 185px !important;
  width: 185px !important;
}

.info-back > h3 {
  font-size: 12px !important;
}

.info > h3 {
  font-size: 11px !important;
}

}



/* Mobile Layout: 320px. */

@media only screen and (min-width: 768px) and (max-width: 1023px) {


.hover_effects_li {
  margin: 0 auto !important;
}

.hover_effects_li {

  width: 50% !important;
}

.ih-item.circle {

  height: 220px !important;
  width: 220px !important;
}

.ih-item.circle .img {
  height: 220px !important;
  width: 220px !important;
}

.ih-item.square {

  height: 200px !important;
  width: 200px !important;
}

.ih-item.square .img {
  height: 200px !important;
  width: 200px !important;
}

.square .img > img {
  height: 185px !important;
  width: 185px !important;
}

.info-back > h3 {
  font-size: 14px !important;
}

.info > h3 {
  font-size: 14px !important;
}
}



/* Wide Mobile Layout: 480px. */

@media only screen and (min-width: 480px) and (max-width: 767px) {

.hover_effects_li {
  margin: 0 auto !important;
  width: 52% !important;
}

.ih-item.circle {

  height: 250px !important;
  width: 250px !important;
}

.ih-item.circle .img {
  height: 250px !important;
  width: 250px !important;
}

.ih-item.square {
  height: 200px !important;
  width: 300px !important;
}

.ih-item.square .img {
  height: 200px !important;
  width: 300px !important;
}

.square .img > img {
  height: 186px !important;
  width: 283px !important;
}

.info-back > h3 {
  font-size: 13px !important;
}

.info > h3 {
  font-size: 13px !important;
}
}

/* Wide Mobile Layout: 320px. */

@media only screen and (min-width: 320px) and (max-width: 479px) {

.hover_effects_li {
  margin: 0 auto !important;
  width: 52% !important;
}

.ih-item.circle {

  height: 180px !important;
  width: 180px !important;
}

.ih-item.circle .img {
  height: 180px !important;
  width: 180px !important;
}

.ih-item.square {

  height: 180px !important;
  width: 220px !important;
}

.ih-item.square .img {
  height: 180px !important;
  width: 220px !important;
}

.square .img > img {
  height: 164px !important;
  width: 205px !important;
}


.info-back > h3 {
  font-size: 11px !important;
}

.info > h3 {
  font-size: 12px !important;
}
}