// gallery breakpoints

$g-break-m: 800px;
$g-break-s: 500px;
$g-break-xs: 400px;

.xprez-gallery {

	&.xprez-photo-connect-false {
		padding: 0 $s-space;
		@media only screen and (max-width: ($g-break-m)) {
			padding: 0 $xs-space;
		}
	}
	&.full-width {
		@include full-width;
	}
	&.mid-width {
		@include m-width;
		&.xprez-photo-connect-false {
			max-width: $m-width + $s-space*4;
		}
	}
	&.text-width {
		@include s-width;
		&.xprez-photo-connect-false {
			max-width: $s-width + $s-space*4;
		}
	}
	img { 
		width: 100%; 
		display: block;
	}
	@include clearfix;
}
.xprez-media-caption {
	@include type(15px,1.3,0,1);
	@include type-min(13px,1,0,.5);
	font-style: italic;
	display: block;
	text-align: center;
	padding: .5*$g 10px 0;
	opacity: 0.7;
}
.xprez-photo-item {
	box-sizing: border-box;
	cursor: pointer;
	.xprez-photo-connect-false & {
		padding: $s-space;
		@media only screen and (max-width: ($g-break-m)) {
			padding: $xs-space;
		}
		.xprez-media-caption {
			//margin-bottom: 0;
		}
	}
}
.xprez-cols-1 {
	.xprez-photo-item {
		width: 100%;
	}
}
.xprez-cols-2 {
	.xprez-photo-item {
		float: left;
		width: 50%;
		&:nth-child(2n+3) { clear: left; }
		@media only screen and (max-width: ($g-break-s)) {
			width: 100%;
		}
	}
}
.xprez-cols-3 {
	.xprez-photo-item {
		float: left;
		width: 33.33%;
		&:nth-child(3n+4) {clear: left;}
		@media only screen and (max-width: ($g-break-m)) {
			width: 50%;
			&:nth-child(3n+4) { clear: none; }
			&:nth-child(2n+3) { clear: left; }
		}
	}
}
.xprez-cols-4 {
	.xprez-photo-item {
		float: left;
		width: 25%;
		&:nth-child(4n+5) {clear: left;}
		@media only screen and (max-width: ($g-break-m)) {
			width: 50%;
			&:nth-child(2n+3) {clear: left;}
		}
	}
}
.xprez-cols-6 {
	.xprez-photo-item {
		float: left;
		width: 16.66%;
		@media only screen and (min-width: ($g-break-m)) {
			&:nth-child(6n+7) {clear: left;}
		}
		@media only screen and (max-width: ($g-break-m)) {
			width: 25%;
			&:nth-child(4n+5) {clear: left;}
		}
	}
	&.xprez-photo-connect-false {
		.xprez-photo-item {
			padding: $xs-space;
		}
	}
}
.xprez-cols-8 {
	.xprez-photo-item {
		float: left;
		width: 12.5%;
		&:nth-child(8n+9) {clear: left;}
		@media only screen and (max-width: ($g-break-m)) {
			width: 25%;
			&:nth-child(4n+5) {clear: left;}
		}
	}
	&.xprez-photo-connect-false {
		.xprez-photo-item {
			padding: $xs-space;
		}
	}
}
