
.gallery {
	width:calc(95%-40px); /* was 80% */
	margin:0 auto 20px auto;
	padding:20px 0 14px 22px;
	position:relative;
	background-color:#081533;  /* #081533 (dk navy) #0c1f4c (navy) #2d2d2d (dk grey)*/ /************************************************************ BG  */
	font:14px Arial;
	}

.gallery .sorting {
	margin:0px 0px 15px 0px;
	border:1px solid #5de;                   /************************************************************ COLOR 1  */
	background-color:rgba(85,221,238,.3);	/************************************************************     COLOR 1 + alpha  */
}
.gallery .sorting span {
	padding:0px 20px 0px 0px;
	color:#cff;                      /***********************************************************     COLOR 1  */
	font-style:italic;	
}
.gallery .sorting div {
	margin:10px 0px 10px 10px;	
}
.gallery .sorting a {
	color:#fff;                            /*********************************************************** WHITE */
	font-size:.85em;
	text-decoration:none;
	/*text-transform:uppercase;*/
	padding:3px 20px 3px 20px;
	background:url(../images/check_normal.gif) no-repeat 0px 3px;
}
.gallery .sorting a:hover {
	color:#5de;                      /***********************************************************     COLOR 2  */
}
.gallery .sorting a.selected {
	color:#5de; /* was #5de */      /************************************************************     COLOR 2  */
	background:url(../images/check_selected.gif) no-repeat 0px 3px;
}

.gallery .photos .thumbnail_container {
	position:relative;
	/*background-color:#777; for testing ONLY */
}
.gallery .photos .thumbnail_container a.thumbnail {
	position:absolute;	
}
.gallery .photos .thumbnail_container a.thumbnail img {
	width:92px;
	height:62px;
	border: 1px solid #5de;	         /************************************************************     COLOR 1  */
}

.clear_both {
	clear:both;
	line-height:1px;	
}
/* for testing ONLY 
.photos {
	background-color:#555;	
}
*/

@media screen and (min-width:50px) and (max-width:500px) {
	/*body {
		padding:5px 0px 0px 5px; MOVED to gallery
		}*/
	.gallery {
		width:auto;
		margin-left:0;
		padding:10px 0px 0px 10px;
	}
	.gallery .sorting span {
		display:block;
		color:#5de;                /************************************************************     COLOR 2  */
		padding:0px 0px 10px 0px;	
	}
	.gallery .sorting a {
		display:block;	
	}
}

@media screen and (min-width:501px) and (max-width:960px) {
	.gallery .sorting span {
		display:block;
		padding:0px 0px 20px 0px;	
	}
	.gallery .sorting a {
		display:block;
		width:35%;
		float:left;	
		margin-bottom:5px;
	}	
}
@media screen and (min-width:961px) {
	.gallery .sorting span {
		padding:0px 20px 0px 0px;	
	}	
}




































