.projects {
	margin-top:4.5%;
}
.project {
	padding-top:20px;
	border-top:2px solid black;
	padding-bottom:30px;
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	line-height:140%;
	font-size:17px
}
.project-title h3 {
	font-size:24px;
	font-family: 'Raleway', sans-serif;
	font-weight: 600;
}
.gray-square {
	width:20px;
	height:20px;
	background-color:#999999;
	margin:0 15px;
	margin-top:1px;
}
.label-container {
	margin-bottom:5px;
}
.project-label {
	color:#999999;
	font-family: 'Raleway', sans-serif;
	font-weight: 600;
}
.project-copy {
	margin-top:10px;
}
.project-gallery {
	padding-top:4.5%;
	/* 
		Width of the project gallery needs to be wider than the page, to accomodate one thumb's right margin (originally 2%).
		This width is calculated by 1 / (1 - 0.02) = 1/0.98 = 1.02040816327 = 102.040816327%
	*/
	width:102.040816327%;
	position:relative;

}
.project-image-container {
	width:					18%;
	margin-right:			2%;
	padding-bottom:			2%;
	display:				inline-block;
	float:					none;
	vertical-align:			top;
	white-space: 			nowrap;
}

/* COMMENTED OUT 25 MAY 2017 for a wider layout*/
/*
.project-image-container {
	width:					23%;
	margin-right:			2%;
	padding-bottom:			2%;
	display:				inline-block;
	float:					none;
	vertical-align:			top;
	white-space: 			nowrap;
}
*/

.project-thumb {
	cursor: pointer;
	width:100%;
	padding-top:100%;
	background-position: 	center center;
    background-repeat: 		no-repeat;
    background-size: 		cover;
    background-color: 		#E5E5E5;
}
.inspector {
	text-align:center;
	margin-top:15px;
	position:absolute;
	top:auto;
	width:98%;
	padding:2% 100% 2% 100%;
	left:-100%; /* To negate the left margin */
	/*height:400px;*/
	background-color:#E5E5E5;
}
.inspector img {
}
.triangle-house {
	position:relative;
}
.triangle {
	position:absolute;

	top:auto;
	left:50%;

	width: 0;
	height: 0;

	margin-left:-15px;
	border-left: 15px solid transparent;
	border-right: 15px solid transparent;
	border-bottom: 15px solid #E5E5E5;
}

.inspector, .triangle {
	display:none;
}

@media all and (max-width: 702px) {
	.project-image-container {
		width:31.33333333333%;
	}
}
@media all and (max-width: 478px) {
	.project-gallery {
		width:104.166666667%;
	}
	.project-image-container {
		width:46%;
		margin-right:4%;
		padding-bottom:4%;
	}
}
