/*
* Gallery's default settings.
*/

#gallery img {
  margin:0
}

.galleryAlbum,
.galleryPhoto {
  display:inline-block;
  vertical-align:top
}

.galleryAlbum p,
.galleryPhoto p {
  text-align:center
}

.galleryPhoto p {
  display:none
}

.galleryAlbum img,
.galleryPhoto img {
  left:50%;
  position:absolute;
  top:50%;
  transform:translate(-50%, -50%)
}

.galleryImageMask {
  overflow:hidden;
  padding-top:100%;
  position:relative
}

/*device driver*/
/*QVGA screen - default*/
@media screen and (max-width:320px) {
.galleryAlbum,
.galleryPhoto {
  margin:2%;
  width:46% /*2 accross*/
}
}

/*HVGA screen*/
@media screen and (min-width:321px) and (max-width:480px) {
.galleryAlbum,
.galleryPhoto {
  margin:1.75%;
  width:29.833%; /*3 accross*/
}
}

/*WVGA screen*/
@media screen and (min-width:481px) and (max-width:800px) {
.galleryAlbum,
.galleryPhoto {
  margin:1.5%;
  width:22%; /*4 accross*/
}
}

/*large screen*/
@media screen and (min-width:801px) and (max-width:1041px) { /*calculating for 4% left & right padding (2% on each side) for max display width of 1000px*/
.galleryAlbum,
.galleryPhoto {
  margin:1.25%;
  width:17.5%; /*5 accross*/
}
}

/*extra large screen*/
@media all and (min-width:1042px) { /*calculating for 4% left & right padding (2% on each side) for max display width of 1000px*/
.galleryAlbum,
.galleryPhoto {
  margin:1%;
  width:14.666%; /*6 accross*/
}
}
