/*Things to change:
- slideshow width
- slideshow mask width
- slideshow mask height (the max height portrait images are allowed)
- slideshow caption
*/

/*Galleries page*/
.album{
	display: inline;
	float: left;
	width: 150px;
	margin: 20px 28px 0px 28px;
	text-align: center;
	height: 140px;
}

.album .image{
	height: 105px;
}

.album img{
	max-width: 150px; /*Assume image isn't taller - if it is smaller - it will be stretched*/
	max-height: 100px;
}

.album p{
	margin-bottom: 5px;
}

/*Gallery page elements*/
.hidden{
	display: none;
}

.gallery .description{
	padding: 10px 0px;
	text-align: center;	
}

.gallery .description p{
	margin-bottom: 0px;
}

.slideshow-controls{
	text-align: center;	
	margin-bottom: 10px;
}

.slideshow-controls-left, .slideshow-controls-middle, .slideshow-controls-right{
	float: left;
	width: 33.3%;
}

.slideshow-controls-left img{
	float: right;
	cursor: pointer;
}

.slideshow-controls-right img{
	float: left;
	cursor: pointer;	
}

#play-image{
	margin-left: 5px;
}

#back-to-galleries-image{
	margin-right: 5px;
}

.slideshow{
	position:relative;
	text-align: center;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.slideshow img{
	cursor: pointer;
	max-width: 100%;
	box-sizing: border-box;
}

.slideshow .caption{
	xwidth: 600px;
	margin: 0px auto 5px auto;
}

.slideshow #right-mask{
	left: 350px;
}

.slideshow #left-mask{
	left: 0px;
}

.clear-album4{
	clear: both;
}

.clear-album3{
	clear: none;
}

.clear-album2{
	clear: none;
}

@media (max-width: 940px) {
	.clear-album3{
		clear: both;
	}
	
	.clear-album4{
		clear: none;
	}
	
	.clear-album2{
	clear: none;
}

	.album{
		width: 33%;
		margin: 20px 0px 0px 0px;
	}
}

@media (max-width: 735px) {
	.clear-album2{
		clear: both;
	}
	
	.clear-album3{
		clear: none;
	}
	
	.clear-album4{
		clear: none;
	}
	
	.album{
		width: 49%;
		margin: 20px 0px 0px 0px;
	}
}

@media (max-width: 520px) {
	.clear-album2{
		clear: none;
	}
	
	.clear-album3{
		clear: none;
	}
	
	.clear-album4{
		clear: none;
	}
	
	.album{
		width: 100%;
		box-sizing: border-box;
		margin: 20px auto 0px auto;
	}
}