/* CSS Document */

.gallery {
	position: relative;
	text-align: left;
	margin: 2rem;
}

.gallery .sorting {
	margin-bottom: 1rem;
	border: 1px solid #302f4c;
	background-color: rgba(39, 107, 178, .3);
}

.gallery .sorting span {
	line-height: 1.5rem;
	color: #000;
	font-style: italic;
}

.gallery .sorting div {
	margin: 1rem 0 1rem 1rem;
}

.gallery .sorting a {
	text-transform: uppercase;
	padding: 3px 20px 3px 20px;
	background: url(../img/check_normal.gif) no-repeat 0px 6px;
}

.gallery .sorting a.selected {
	background-image: url(../img/check_selected.gif);
}

.gallery .photos .thumbnail_container {
	position: relative;
}

.gallery .photos .thumbnail_container a.thumbnail {
	position: absolute;
}

.gallery .photos .thumbnail_container a.thumbnail img {
	width: 128px;
	height: 128px;
	border: 1px solid #302f4c;
}

.clear_both {
	clear: both;
	line-height: 1px;
}


/* Horizontal */

@media screen and (min-width:50px) and (max-width:520px) {
	.gallery {
		width: auto;
	}

	.gallery .sorting span, .gallery .sorting a {
		display: block;
	}
}

@media screen and (min-width:521px) and (max-width:700px) {
	.gallery .sorting span, .gallery .sorting a {
		display:block;
	}
}