#cboxOverlay { background: rgba(217,217,217, 1) !important; }

.photos { 
	/* margin-bottom: 30px; */
	background: #d9d9d9;
	padding: 40px 0 10px 0;
}

.photos .container { width: 90% !important; }

.photo-list { padding: 5px 0; }

* { box-sizing: border-box; } /* masonry */

.photos h2, .photos h3 {
	text-align: center; 
	color: #888;
}

.photos .button {
	background: none;
	color: #fff;
	border-color: #fff;
}

.photos .button:hover {
	background: #00AEEF;
	border-color: #00AEEF;
}

.photo-thumb { 
	float: left;
	width: 33.3%;
	border: 5px rgba(255,255,255,0) solid;
-webkit-transition: border 250ms linear;
-moz-transition: border 250ms linear;
-ms-transition: border 250ms linear;
-o-transition: border 250ms linear;
transition: border 250ms linear;
}

.photo-thumb:hover { 
	border: 5px rgba(255,255,255,1) solid;
}

.photo-thumb img{
	/* min-width: 100%; */ 
}

.photo-icon:after {
	font-family: "icons";
	content: "D";
	speak: none;
	font-size: 200%;
	padding-left: 7px;
	line-height: 0; 
}  

ul#home .photo-icon:after,
ul#home .video-icon:after {

}

.video-icon:after {
	font-family: "icons";
	content: "q";
	speak: none;
	font-size: 300%;
	padding-left: 7px;
	line-height: 0; 
	vertical-align: middle;
} 

.doc-icon:after {
	font-family: "icons";
	content: "'";
	speak: none;
	font-size: 300%;
	padding-left: 7px;
	line-height: 0; 
	vertical-align: middle;
}  


/* #Media Queries
================================================== */

	/* full desktop (devices and browsers) */
	@media only screen and (min-width: 1900px) {
		.photo-thumb { width: 20%; }
	}

		@media only screen and (min-width: 1600px) and (max-width: 1899px) {
		.photo-thumb { width: 20%; }
	}

	@media only screen and (min-width: 1000px) and (max-width: 1599px) {
		.photo-thumb { width: 20%; }
	}
	
	@media only screen and (min-width: 960px) and (max-width: 999px) {
		.photo-thumb { width: 25%; }
	}

	@media only screen and (min-width: 767px) and (max-width: 959px) { 
		.photo-thumb { width: 25%; }
	}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	/* Note: Design for a width of 480px */
	@media only screen and (max-width: 767px) { 
		.photos .container { width: 100% }
	}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	/* Note: Design for a width of 320px */
	@media only screen and (max-width: 480px) { 
		.photo-thumb {  }
	}