/*
* @author: William Khoe
*/


.rec-item
{
    position:relative; display:block; float:left;
	/*width:296px;*/ 
    overflow:visible;
	margin:0 0 0 0; padding:5px;
	
}
.rec-item img
{
	display:block;
	width:100%; 
    height:auto;
}


/* Inspiration Item: Category */
.rec-item.category
{
	background-color:#FFF; box-shadow:1px 1px 6px rgba(0,0,0,0.3);
	color:#222;
	text-decoration:none;
}
.rec-item.category:hover
{
	color:#ED1C27;
}


/* Inspiration Item: Project */
.rec-item.project
{
	background-color:#FFF; box-shadow:1px 1px 6px rgba(0,0,0,0.3);
}
.rec-item.project div
{
	position:relative;
	z-index:1;
}
.rec-item.project img
{
	display: block;
	width: 200px;
	margin: 0 auto;
}
.rec-item.project .img2
{
    width:49%;
    display:inline;
}
.rec-item.project .details
{
	padding:20px 17px 10px 17px;
}
.rec-item.project h3
{
	color:#222;
	font-weight:400; font-size:19px; line-height:20px; text-align:center;
}






/* Tablet Portrait */

@media only screen and (min-width:768px) and (max-width:1023px)
{
   .rec-item
	{
		width:216px;
		margin:0 0 0 0; padding:5px;
	}
	.rec-item.submit-project,
	.rec-item.show-results
	{
		/*width:190px; height:173px;*/
		padding:20px 17px 20px 19px;
	}
	.rec-item.submit-project h3,
	.rec-item.show-results h3
	{
		margin:0 0 0 0;
		font-size:14px; line-height:14px;
	}
	.rec-item.submit-project p,
	.rec-item.show-results p
	{
		margin:0 0 5px 0;
		font-size:11px;
	}
	.rec-item.submit-project .hk,
	.rec-item.show-results .hk
	{
		bottom:-14px;
		background-size:72%;
	}
	.rec-item.info
	{
		width:226px;
	}
	.rec-item.info div
	{
		padding:15px;
	}

	#project-directions .photo-showcase .thumbnail.secondary
	{
		display:none;
	}
	#project-directions .photo-showcase aside
	{
		display:none;
	}
	#project-directions .photo-showcase .thumbnail.primary
	{
		border-right:0;
	}
	#project-directions .photo-showcase .thumbnail.primary img
	{
		width:437px;
	}
}

/* Mobile Portrait & Landscape */

@media only screen and (max-width:767px)
{
	#project-directions .photo-showcase
	{
		
	}
}


.masonry-grid {
	/*margin-top: 100px;
	margin-left: 50px;
	margin-right: 50px;*/
}

.grid-sizer, .grid-item {
    width: 30.66666666%;
}

.grid-item img {
	width: 100%;
}

#appBlogArticleContainer:after {
    content: '';
    display: block;
    clear: both;
}

.grid-item {
    float: left;
    margin-bottom: 4%;
}

    #appBlogArticleContainer .appBlogArticleItem .appBlogArticleDetail {
        padding-top: 0;
    }

.gutter-sizer {
    width: 4%;
}

@media screen and (max-width: 768px) {
    .masonry-grid .grid-sizer, .masonry-grid  .grid-item {
        width: 100%;
    }
}

@media screen and (max-width: 480px) {
    .masonry-grid .grid-sizer, .masonry-grid .grid-item {
        width: 100%;
    }
}