/**
 * Cleaner Gallery Stylesheet
 * @version 20150615
 */

.gallery {
	max-width: 100%;
	display:   block;
	clear:     both;
	margin:    0 auto 20px;
}

	.gallery::after {
		content:    ".";
		display:    block;
		height:     0;
		clear:      both;
		visibility: hidden;
	}

		.gallery-item {
			width:      100%;
			padding:    0;
			text-align: center;
			list-style: none;
			border:     none;
			background: transparent;
			box-sizing: border-box;
		}

			.gallery-icon {}

				.gallery-icon img {
					width:  100%;
					height:     auto;
					margin:     0 auto;
					box-sizing: border-box;
                    display: block;
				}

				.gallery-type-circle img {
					border-radius: 50%;
				}

			.gallery-caption {
				margin:      5px 0 0;
				box-sizing:  border-box;
			}

            .gallery .gallery-item {
                margin-bottom: 2%;
            }

            .gallery .gallery-item a {
                display: block;
            }


.gallery-item {
    float:  left;
    margin: 0 2% 2% 0;
}

    .rtl .gallery-item {
        float:        right;
        margin-left:  2%;
        margin-right: 0;
    }

/* Everything should be 2 columns. */
.gallery-col-2 .gallery-item,
.gallery-col-3 .gallery-item,
.gallery-col-4 .gallery-item,
.gallery-col-5 .gallery-item,
.gallery-col-6 .gallery-item,
.gallery-col-7 .gallery-item,
.gallery-col-8 .gallery-item { width: 49%; }

/* When the screen width is between 480px and 539px. */
@media only screen and ( max-width: 539px ) {

	.gallery-item:nth-of-type( 2n + 1 ) { clear: both; }

	     .gallery-item:nth-child( 2n )  { margin-right: 0; float: right; }
	.rtl .gallery-item:nth-child( 2n )  { margin-left:  0; float: left;  }
}

/* When the screen width is between 540px and 639px. */
@media only screen and ( min-width: 540px ) and ( max-width: 639px ) {

	.gallery-col-3  .gallery-item:nth-child( 3n + 1 ),
	.gallery-col-4  .gallery-item:nth-child( 3n + 1 ),
	.gallery-col-5  .gallery-item:nth-child( 3n + 1 ),
	.gallery-col-6  .gallery-item:nth-child( 3n + 1 ),
	.gallery-col-7  .gallery-item:nth-child( 3n + 1 ),
	.gallery-col-8  .gallery-item:nth-child( 3n + 1 ) { clear: both; }

	.gallery-col-3  .gallery-item:nth-child( 3n ),
	.gallery-col-4  .gallery-item:nth-child( 3n ),
	.gallery-col-5  .gallery-item:nth-child( 3n ),
	.gallery-col-6  .gallery-item:nth-child( 3n ),
	.gallery-col-7  .gallery-item:nth-child( 3n ),
	.gallery-col-8  .gallery-item:nth-child( 3n ) { float: right; margin-left: 0; margin-right: 0; }

	.rtl .gallery-col-3  .gallery-item:nth-child( 3n ),
	.rtl .gallery-col-4  .gallery-item:nth-child( 3n ),
	.rtl .gallery-col-5  .gallery-item:nth-child( 3n ),
	.rtl .gallery-col-6  .gallery-item:nth-child( 3n ),
	.rtl .gallery-col-7  .gallery-item:nth-child( 3n ),
	.rtl .gallery-col-8  .gallery-item:nth-child( 3n ) { float: left; }

	/* Handle the columns. */
	.gallery-col-3 .gallery-item,
	.gallery-col-4  .gallery-item,
	.gallery-col-5  .gallery-item,
	.gallery-col-6  .gallery-item,
	.gallery-col-7  .gallery-item,
	.gallery-col-8  .gallery-item { width: 32%;   }
}

/* When the screen width is between 640px and 767px. */
@media only screen and ( min-width: 640px ) and ( max-width: 767px ) {

	.gallery-col-2  .gallery-item:nth-child( 2n + 1 ),
	.gallery-col-3  .gallery-item:nth-child( 3n + 1 ),
	.gallery-col-4  .gallery-item:nth-child( 4n + 1 ),
	.gallery-col-5  .gallery-item:nth-child( 4n + 1 ),
	.gallery-col-6  .gallery-item:nth-child( 4n + 1 ),
	.gallery-col-7  .gallery-item:nth-child( 4n + 1 ),
	.gallery-col-8  .gallery-item:nth-child( 4n + 1 ) { clear: both; }

	.gallery-col-2  .gallery-item:nth-child( 2n ),
	.gallery-col-3  .gallery-item:nth-child( 3n ),
	.gallery-col-4  .gallery-item:nth-child( 4n ),
	.gallery-col-5  .gallery-item:nth-child( 4n ),
	.gallery-col-6  .gallery-item:nth-child( 4n ),
	.gallery-col-7  .gallery-item:nth-child( 4n ),
	.gallery-col-8  .gallery-item:nth-child( 4n ) { float: right; margin-left: 0; margin-right: 0; }

	.rtl .gallery-col-2  .gallery-item:nth-child( 2n ),
	.rtl .gallery-col-3  .gallery-item:nth-child( 3n ),
	.rtl .gallery-col-4  .gallery-item:nth-child( 4n ),
	.rtl .gallery-col-5  .gallery-item:nth-child( 4n ),
	.rtl .gallery-col-6  .gallery-item:nth-child( 4n ),
	.rtl .gallery-col-7  .gallery-item:nth-child( 4n ),
	.rtl .gallery-col-8  .gallery-item:nth-child( 4n ) { float: left; }

	/* Handle the columns. */
	.gallery-col-2 .gallery-item  { width: 49%; }
	.gallery-col-3 .gallery-item  { width: 32%; }
	.gallery-col-4  .gallery-item,
	.gallery-col-5  .gallery-item,
	.gallery-col-6  .gallery-item,
	.gallery-col-7  .gallery-item,
	.gallery-col-8  .gallery-item { width: 23.5%;   }
}

/* When the screen width is at least 768px. */
@media only screen and ( min-width: 768px ) {

	.gallery-col-2  .gallery-item:nth-child( 2n  + 1 ),
	.gallery-col-3  .gallery-item:nth-child( 3n  + 1 ),
	.gallery-col-4  .gallery-item:nth-child( 4n  + 1 ),
	.gallery-col-5  .gallery-item:nth-child( 5n  + 1 ),
	.gallery-col-6  .gallery-item:nth-child( 6n  + 1 ),
	.gallery-col-7  .gallery-item:nth-child( 7n  + 1 ),
	.gallery-col-8  .gallery-item:nth-child( 8n  + 1 ) { clear: both; }

	.gallery-col-2  .gallery-item:nth-child( 2n  ),
	.gallery-col-3  .gallery-item:nth-child( 3n  ),
	.gallery-col-4  .gallery-item:nth-child( 4n  ),
	.gallery-col-5  .gallery-item:nth-child( 5n  ),
	.gallery-col-6  .gallery-item:nth-child( 6n  ),
	.gallery-col-7  .gallery-item:nth-child( 7n  ),
	.gallery-col-8  .gallery-item:nth-child( 8n  ) { margin-left: 0; margin-right: 0; }

	/* Handle the columns. */
	.gallery-col-2 .gallery-item  { width: 49%;    }
	.gallery-col-3 .gallery-item  { width: 32%;    }
	.gallery-col-4 .gallery-item  { width: 23.5%; }
	.gallery-col-5 .gallery-item  { width: 18.4%;    }
	.gallery-col-6 .gallery-item  { width: 15%;  }
	.gallery-col-7 .gallery-item  { width: 12.57%;    }
	.gallery-col-8 .gallery-item  { width: 8.125%; }
}