/* Image Boxes CSS Document */

	
	/* Image boxes */
	.image-boxes {
	display:block;
	}
	
		.image-boxes .image-box {
		float:left;
		display:inline-block;
		position:relative;
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
		-ms-box-sizing:border-box;
		box-sizing:border-box;
		}
			/* 7 Column Image boxes */
			.image-boxes.seven-column .image-box {
			width:13%;
			margin-right:1.5%;
			margin-bottom:10px;
			}
				.image-boxes.text-over.seven-column .image-box {height:auto;}
				.image-boxes.seven-column .image-box:nth-child(7n+7) {margin-right:0%;}
				.image-boxes.seven-column .image-box:nth-child(7n+8) {clear:both;}
		
			/* 6 Column Image boxes */
			.image-boxes.six-column .image-box {
			width:15%;
			margin-right:2%;
			margin-bottom:20px;
			}
				.image-boxes.text-over.six-column .image-box {height:auto;}
				.image-boxes.six-column .image-box:nth-child(6n+6) {margin-right:0%;}
				.image-boxes.six-column .image-box:nth-child(6n+7) {clear:both;}
		
			/* 5 Column Image boxes */
			.image-boxes.five-column .image-box {
			width:16%;
			margin-right:5%;
			margin-bottom:30px;
			}
				.image-boxes.text-over.five-column .image-box {height:auto;}
				.image-boxes.five-column .image-box:nth-child(5n+5) {margin-right:0%;}
				.image-boxes.five-column .image-box:nth-child(5n+6) {clear:both;}
				
			/* 4 Column Image boxes */
			.image-boxes.four-column .image-box {
			width:25%;
			margin-right:0%;
			margin-bottom:30px;
			}
				.image-boxes.four-column.feature .image-box {border-right:1px solid #9e9e9e;}
						
				.recipes.image-boxes.four-column .image-box {
				width:295px;
				margin-right:40px;
				}
				
				.image-boxes.four-column.recipes .image-box {
				width:22%;
				margin-right:4%;	
				}
			
				.image-boxes.text-over.four-column .image-box {height:auto;}
				.image-boxes.four-column.feature .image-box:first-child {border-left:1px solid #9e9e9e;}
				.image-boxes.four-column .image-box:nth-child(4n+4) {margin-right:0%;}
				.image-boxes.four-column .image-box:nth-child(4n+5) {clear:both;}
				
			/* 3 Column Image boxes */
			.image-boxes.three-column .image-box {
			width:32%;
			margin-right:2%;
			margin-bottom:20px;
			}
				.image-boxes.text-over.three-column .image-box {height:auto;}
				.image-boxes.three-column .image-box:nth-child(3n+3) {margin-right:0%;}
				.image-boxes.three-column .image-box:nth-child(3n+4) {clear:both;}
				
			/* 2 Column Image boxes */
			.image-boxes.two-column .image-box {
			width:48%;
			margin-right:4%;
			margin-bottom:40px;
			}
				.image-boxes.text-over.two-column .image-box {height:auto;}
				.image-boxes.two-column .image-box:nth-child(2n+2) {margin-right:0%;}
				.image-boxes.two-column .image-box:nth-child(2n+3) {clear:both;}
				
			/* 1 Column Image boxes */
			.image-boxes.one-column .image-box {
			width:100%;
			margin-right:0%;
			margin-bottom:30px;
			}
				.image-boxes.text-over.one-column .image-box {height:auto;}
		
		
		/* Text Over Image boxes */
		.image-boxes.text-over .image-box {
		overflow:hidden;
		}
			.image-boxes.text-over .image-box .image-box-text {
			position:absolute;
			top:0px;
			left:0px;
			right:0px;
			bottom:0px;
			display:block;
			padding:10px;
			-webkit-box-sizing:border-box;
			-moz-box-sizing:border-box;
			-ms-box-sizing:border-box;
			box-sizing:border-box;
			z-index:500;
			}
				.image-boxes.text-over .image-box .image-box-text,
				.image-boxes.text-over .image-box .image-box-text .silent {color:#ffffff;}



		/* Text Under Image boxes */
		.image-boxes.text-under .image-box {}
		
			.image-boxes.text-under .image-box a.image-box-text {
			display:block;
			padding-top:10px;
			text-align:center;
			}
				.image-boxes.text-under .image-box a.image-box-text h3 {
				font-size: 22px;	
				}
				
				
			/* Image box images */		
			.image-boxes .image-box a.image-box-image {
			display:block;
			}
			
				.image-boxes .image-box:hover a.image-box-image {
				opacity:0.7;
				}
				
			.image-boxes .image-box a.image-box-image {
			display:block;
			-webkit-backface-visibility:hidden;
			-moz-transition:all .3s ease-out;
			-webkit-transition:all .3s ease-out;
			transition:all .3s ease-out;
			}
		
				.image-boxes .image-box a.image-box-image img {
				vertical-align:middle;
				}
				
		/* Feature Image Boxes */		
		.feature.image-boxes .image-box {
		position:relative;
		margin-bottom:0;	
		}
			
			.feature.image-boxes .image-box .image-box-image img {
			opacity:0;
			-webkit-transition: all 600ms cubic-bezier(0.19, 1, 0.22, 1);
			-moz-transition: 	all 600ms cubic-bezier(0.19, 1, 0.22, 1);
			-ms-transition: 	all 600ms cubic-bezier(0.19, 1, 0.22, 1);
			transition:         all 600ms cubic-bezier(0.19, 1, 0.22, 1);
			}
			
				.feature.image-boxes .image-box:hover .image-box-image img {opacity:0.7;}
		
			.feature.image-boxes .image-box .title-over {
			position:absolute;
			color:#fff;
			left:0;
			right:0;
			bottom:0;
			top:0;
			line-height:160px;
			text-align:center;
			pointer-events:none;
			display:block;
			font-size:28px;
			font-weight:100;
			text-shadow:rgba(0,0,0,0.7) 0 0 14px;
			}
			
			.feature.image-boxes .image-box .image-box-text {
			display:block;
			position:absolute;
			top:0;
			left:0;
			right:0;
			opacity:0;
			z-index:-1;
			background-color:#333;
			background-image:url(../../../images/divider_texture.png);
			background-position:top center;
			background-repeat:repeat;
			color:#fff;
			font-size:22px;
			line-height:32px;
			font-weight:100;
			padding:12px 30px;
			-webkit-transition: all 600ms cubic-bezier(0.19, 1, 0.22, 1);
			-moz-transition: 	all 600ms cubic-bezier(0.19, 1, 0.22, 1);
			-ms-transition: 	all 600ms cubic-bezier(0.19, 1, 0.22, 1);
			transition:         all 600ms cubic-bezier(0.19, 1, 0.22, 1);
			-webkit-box-sizing:border-box;
			-moz-box-sizing:border-box;
			-ms-box-sizing:border-box;
			box-sizing:border-box;
			}				
				.feature.image-boxes .image-box .image-box-text .silent,
				.feature.image-boxes .image-box .image-box-text a {color:#fff;}
					.feature.image-boxes .image-box .image-box-text a:hover {text-decoration:underline;}
				
					.feature.image-boxes .image-box:hover .image-box-text {
					opacity:1;
					top:100%;
					z-index:600;
					}
					
		/* Recipes Image Boxes */
		.recipes.image-boxes .image-box {
		position:relative;
		}
		
			.recipes.image-boxes .image-box:before {
			content:"";
			background-color:rgba(0,0,0,0.6);
			position:absolute;
			left:0;
			right:0;
			top:0;
			bottom:0;
			z-index:400;
			opacity:0;
			pointer-events:none;
			-webkit-transition: all 600ms cubic-bezier(0.19, 1, 0.22, 1);
			-moz-transition: 	all 600ms cubic-bezier(0.19, 1, 0.22, 1);
			-ms-transition: 	all 600ms cubic-bezier(0.19, 1, 0.22, 1);
			transition:         all 600ms cubic-bezier(0.19, 1, 0.22, 1);
			}
				.recipes.image-boxes .image-box:hover:before {opacity:1;}
			
			.recipes.image-boxes .image-box:hover a.image-box-image {
			opacity:1;
			}
			
			
			.recipes.image-boxes .image-box .image-box-text {
			position:absolute;
			font-size:18px;
			text-align:center;
			color:#fff;
			left:3%;
			right:3%;
			width:94%;
			top:42%;
			z-index:999;
			opacity:0;
			border-radius:4px;
			border:1px solid #fff;
			-webkit-transition: all 600ms cubic-bezier(0.19, 1, 0.22, 1);
			-moz-transition: 	all 600ms cubic-bezier(0.19, 1, 0.22, 1);
			-ms-transition: 	all 600ms cubic-bezier(0.19, 1, 0.22, 1);
			transition:         all 600ms cubic-bezier(0.19, 1, 0.22, 1);
			-webkit-box-sizing:border-box;
			-moz-box-sizing:border-box;
			-ms-box-sizing:border-box;
			box-sizing:border-box;
			}
			
				.recipes.image-boxes .image-box:hover .image-box-text {
				opacity:1;	
				}
				
				.recipes.image-boxes .image-box .image-box-text h3 {
				font-size:18px;
				font-weight:300;	
				color:#fff;
				padding:8px 0;
				}
				
	/* Mulch Boxes */
	.masonry {
	displaY:block;	
	width:100%;
	margin-top:0;
	margin-bottom:42px;
	}
	
	.masonry.mobile {display:none;}
	
		.masonry .grid-column {
		float:left;
		width:32%;
		margin-right:2%;	
		overflow:hidden;
		}
			.masonry .grid-column.three {margin-right:0;}
		
			.masonry .grid-column .image-box {
			position:relative;
			overflow:hidden;
			border-radius:4px;
			width:100%;
			}
			
				.masonry .grid-column .image-box .box-image {
				overflow:hidden;
				border-radius:4px!important;	
				}
				
				.masonry .grid-column .image-box .box-image-mobile {display:none;}
			
					.masonry .grid-column .image-box .box-image img {
					vertical-align:middle;
					-webkit-transition: all 600ms cubic-bezier(0.19, 1, 0.22, 1);
					-moz-transition: 	all 600ms cubic-bezier(0.19, 1, 0.22, 1);
					-ms-transition: 	all 600ms cubic-bezier(0.19, 1, 0.22, 1);
					transition:         all 600ms cubic-bezier(0.19, 1, 0.22, 1);
					-webkit-box-sizing:border-box;
					-moz-box-sizing:border-box;
					-ms-box-sizing:border-box;
					box-sizing:border-box;
					border-radius:4px!important;
					}
					
						.masonry .grid-column .image-box:hover .box-image img {
						-webkit-transform:rotate(5deg) scale(1.2);
						-moz-transform:rotate(5deg) scale(1.2);					
						-ms-transform:rotate(5deg) scale(1.2);
						transform:rotate(5deg) scale(1.2);
						border-radius:4px!important;
						}
				
				.masonry .grid-column .image-box .box-text {
				height:90%;
				position:absolute;
				left:10%;
				right:10%;
				bottom:5%;
				top:5%;
				z-index:600;	
				color:#fff;
				-webkit-box-sizing:border-box;
				-moz-box-sizing:border-box;
				-ms-box-sizing:border-box;
				box-sizing:border-box;
				text-shadow:rgba(0,0,0,075) 0 0 8px;
				}	
					
					.masonry .image-box .box-text:focus {
					outline:none;
					outline-offset:none;
					}
					
					.masonry .grid-column .image-box .box-text h3 {
					position:absolute;
					left:0;
					right:0;
					top:0;
					z-index:600;
					color:#fff;	
					font-weight:700;
					}
				
					.masonry .grid-column .image-box .box-text h4 {
					position:absolute;
					bottom:0;
					left:0;
					right:0;
					z-index:600;
					font-weight:500;
					font-size:26px;
					line-height:1.2;	
					}
					
				.lightbox-popup {
				position:relative;
				background:transparent;
				padding:0 20px;
				width:auto;
				max-width:1300px;
				margin:0 auto;
				}
				
					.lightbox-popup .box-image {
					float:left;
					max-height:80vh;
					display:block;
					overflow:hidden;	
					}
					
					.lightbox-popup .box-text {
					float:right;
					max-width:50%;
					color:#fff;	
					font-size:18px;
					}
					
						.lightbox-popup .box-text h3 {
						color:#fff;
						font-size:32px;
						padding-top:0;
						padding-bottom:8px;
						}
						
						.lightbox-popup .box-text h4 {
						padding:0 0 24px 0;	
						}
						
						.lightbox-popup .box-text .silent {color:#fff;}
						
					.lightbox-popup .box-logo {
					float:right;
					clear:right;
					margin-top:45px;
					}
				
			
			/* Grid Column Specifics */
			.grid-column.one .image-box {
			height:660px;
			}
			
			.grid-column.two .image-box:nth-child(1) {
			height:229px;
			margin-bottom:32px;
			}
			
			.grid-column.two .image-box:nth-child(2) {
			height:399px;
			}
			
			.grid-column.three .image-box:nth-child(1) {
			height:399px;	
			margin-bottom:32px;
			}
			
			.grid-column.three .image-box:nth-child(2) {
			height:229px;	
			}
			
				
				
				
/* Media Queries */

@media screen and (max-width:1340px) {

	.feature.image-boxes .image-box,
	.image-boxes.four-column.feature .image-box {
	border-right:none;
	border-left:none;
	}
		.image-boxes.four-column.feature .image-box:first-child {border-left:none;}
	
		.feature.image-boxes .image-box .title-over {
		padding:0;	
		line-height:130px;
		}
		
	
	/* Mulch Boxes */
	.grid-column.one .image-box,
	.grid-column.two .image-box:nth-child(1),
	.grid-column.two .image-box:nth-child(2),
	.grid-column.three .image-box:nth-child(1),
	.grid-column.three .image-box:nth-child(2) {
	height:auto;	
	}
		.masonry .grid-column .image-box .box-text h4 {
		font-size:20px;	
		}
		
		.lightbox-popup .box-image {
		max-width:45%;	
		}
					
			.masonry .grid-column .image-box:hover .box-image img {
			-webkit-transform:none;
			-moz-transform:none;					
			-ms-transform:none;
			transform:none;	
			}
		
	
	
	.recipes.image-boxes .image-box .image-box-text {
	top:5%;
	left:5%;
	right:5%;
	bottom:5%;
	width:90%;
	}
	
		
	.recipes.image-boxes .image-box:before {
	opacity:0.4;	
	}
	
		.recipes.image-boxes .image-box:hover:before {
		opacity:0.4;	
		}
		
		.recipes.image-boxes .image-box .image-box-text {
		top:auto;
		border:none;	
		opacity:1;
		}

}

@media screen and (max-width:1280px) {
	
		.feature.image-boxes .image-box .title-over {
		line-height:110px;
		}
}

@media screen and (max-width: 1100px) {
	
	/* Image boxes */
	.image-boxes {}
			
			/* 7 Column Image boxes */
			.image-boxes.seven-column .image-box {
			width:13%;
			margin-right:1.5%;
			margin-bottom:10px;
			}
		
			/* 6 Column Image boxes */
			.image-boxes.six-column .image-box {
			width:15%;
			margin-right:2%;
			margin-bottom:20px;
			}
			
			/* 5 Column Image boxes */
			.image-boxes.five-column .image-box {
			width:16%;
			margin-right:5%;
			margin-bottom:30px;
			}
				
			/* 4 Column Image boxes */
			.image-boxes.four-column .image-box {
			width:25%;
			margin-right:0%;
			margin-bottom:30px;
			}
				
			/* 3 Column Image boxes */
			.image-boxes.three-column .image-box {
			width:32%;
			margin-right:2%;
			margin-bottom:20px;
			}
				
			/* 2 Column Image boxes */
			.image-boxes.two-column .image-box {
			width:48%;
			margin-right:4%;
			margin-bottom:40px;
			}
				
			/* 1 Column Image boxes */
			.image-boxes.one-column .image-box {
			width:100%;
			margin-right:0%;
			margin-bottom:30px;
			}
	
	.feature.image-boxes .image-box,
	.image-boxes.four-column.feature .image-box {
	margin-bottom:0;	
	}
	
		.feature.image-boxes .image-box .image-box-image img {
		opacity:0.1;	
		}
	
		.feature.image-boxes .image-box .title-over {
		top:auto;
		line-height:70px;
		font-size:18px;
		}
		
		.feature.image-boxes .image-box .image-box-text {
		font-size:16px;
		line-height:28px;
		padding:20px 30px;	
		}
	
}


@media screen and (max-width:1000px) {
	
	.masonry {
	margin-top:24px;	
	}
	
	.feature.image-boxes .image-box .image-box-image {opacity:1;}
		.feature.image-boxes .image-box:hover .image-box-image {opacity:1;}
	
		.feature.image-boxes .image-box .image-box-image img {opacity:0.7;}
	
	.feature.image-boxes .image-box .title-over {
	font-weight:500;	
	}
		
	.feature.image-boxes .image-box .image-box-text {
	display:none;
	}
		.feature.image-boxes .image-box:hover .image-box-text {
		top:0;
		opacity:0;
		}
	
}


@media screen and (max-width:900px) {
	
	.image-boxes.masonry {display:none;}
	
	.image-boxes.masonry.mobile {
	display:block;
	}
	
		.masonry.mobile .image-box {
		position:relative;
		width:48%;
		margin-right:4%;
		margin-bottom:24px;
		overflow:hidden;
		border-radius:4px;
		}
			.masonry.mobile .image-box:nth-child(2n+2) {margin-right:0;}
			.masonry.mobile .image-box:nth-child(2n+3) {clear:left;}
				
			.masonry.mobile .image-box .box-text {
			height:90%;
			position:absolute;
			top:5%;
			left:5%;
			right:5%;
			bottom:5%;
			width:90%;
			z-index:600;	
			color:#fff;
			-webkit-box-sizing:border-box;
			-moz-box-sizing:border-box;
			-ms-box-sizing:border-box;
			box-sizing:border-box;
			text-shadow:rgba(0,0,0,075) 0 0 8px;
			font-size:16px;
			}	
				
				.masonry.mobile .image-box .box-text h3 {
				position:absolute;
				left:0;
				right:0;
				top:0;
				z-index:600;
				color:#fff;	
				font-weight:700;
				font-size:24px;
				}
			
				.masonry.mobile .image-box .box-text h4 {
				position:absolute;
				bottom:0;
				left:0;
				right:0;
				z-index:600;
				font-weight:500;
				font-size:18px;
				line-height:1.2;	
				}
	
}


@media screen and (max-width: 850px) {
	
	/* Image boxes */
	.image-boxes {}
			
			/* 7 Column Image boxes - 4 Column */
			.image-boxes.seven-column .image-box {
			width:22%;
			margin-right:4%;
			margin-bottom:30px;	
			}	
			
				.image-boxes.seven-column .image-box:nth-child(7n+7) {margin-right:2%;}
				.image-boxes.seven-column .image-box:nth-child(7n+8) {clear:none;}
				
				.image-boxes.seven-column .image-box:nth-child(4n+4) {margin-right:0%;}
				.image-boxes.seven-column .image-box:nth-child(4n+5) {clear:both;}
	
	
			/* 6 / 5 / 4 Column Image boxes - 3 Column */
			.image-boxes.six-column .image-box,
			.image-boxes.five-column .image-box {
			width:32%;
			margin-right:2%;
			margin-bottom:20px;
			}

				.image-boxes.six-column .image-box:nth-child(6n+6),
				.image-boxes.five-column .image-box:nth-child(5n+5) {margin-right:2%;}
				
				.image-boxes.six-column .image-box:nth-child(6n+7),
				.image-boxes.five-column .image-box:nth-child(5n+6) {clear:none;}
				
				.image-boxes.six-column .image-box:nth-child(3n+3),
				.image-boxes.five-column .image-box:nth-child(3n+3) {margin-right:0%;}
				
				.image-boxes.six-column .image-box:nth-child(3n+4),
				.image-boxes.five-column .image-box:nth-child(3n+4) {clear:both;}
				
			
			/* 4 Column Image boxes - 2 Column */
			.image-boxes.four-column .image-box,
			.image-boxes.four-column.recipes .image-box {
			width:50%;
			margin-right:0;	
			}
				.image-boxes.four-column .image-box:nth-child(4n+4) {margin-right:0%;}
				.image-boxes.four-column .image-box:nth-child(4n+5) {clear:none;}
				
				.image-boxes.four-column .image-box:nth-child(2n+2) {margin-right:0%;}
				.image-boxes.four-column .image-box:nth-child(2n+3) {clear:both;}
				
}


@media screen and (max-width: 650px) {
	
	/* Image boxes */
	.image-boxes {}
	
			/* 7 / 6 / 5 / 4 / 3 Column Image boxes - 2 Column */
			.image-boxes.seven-column .image-box,
			.image-boxes.six-column .image-box,
			.image-boxes.five-column .image-box,
			.image-boxes.four-column .image-box,
			.image-boxes.three-column .image-box,
			.image-boxes.four-column.recipes .image-box  {
			width:48%;
			margin-right:4%;
			margin-bottom:40px;
			}
			
				.image-boxes.seven-column .image-box:nth-child(7n+7),
				.image-boxes.seven-column .image-box:nth-child(4n+4),
				.image-boxes.six-column .image-box:nth-child(6n+6),
				.image-boxes.six-column .image-box:nth-child(3n+3),
				.image-boxes.five-column .image-box:nth-child(5n+5),
				.image-boxes.five-column .image-box:nth-child(3n+3),
				.image-boxes.four-column .image-box:nth-child(4n+4),
				.image-boxes.four-column .image-box:nth-child(3n+3),
				.image-boxes.three-column .image-box:nth-child(3n+3) {margin-right:4%;}
				
				.image-boxes.seven-column .image-box:nth-child(7n+8),
				.image-boxes.seven-column .image-box:nth-child(4n+5),
				.image-boxes.six-column .image-box:nth-child(6n+7),
				.image-boxes.six-column .image-box:nth-child(3n+4),
				.image-boxes.five-column .image-box:nth-child(5n+6),
				.image-boxes.five-column .image-box:nth-child(3n+4),
				.image-boxes.four-column .image-box:nth-child(4n+5),
				.image-boxes.four-column .image-box:nth-child(3n+4),
				.image-boxes.three-column .image-box:nth-child(3n+4) {clear:none;}
				
				.image-boxes.seven-column .image-box:nth-child(2n+2),
				.image-boxes.six-column .image-box:nth-child(2n+2),
				.image-boxes.five-column .image-box:nth-child(2n+2),
				.image-boxes.four-column .image-box:nth-child(2n+2),
				.image-boxes.three-column .image-box:nth-child(2n+2) {margin-right:0%;}
				
				.image-boxes.seven-column .image-box:nth-child(2n+3),
				.image-boxes.six-column .image-box:nth-child(2n+3),
				.image-boxes.five-column .image-box:nth-child(2n+3),
				.image-boxes.four-column .image-box:nth-child(2n+3),
				.image-boxes.three-column .image-box:nth-child(2n+3) {clear:both;}
				
}

@media screen and (max-width:540px) {

	.masonry.mobile .image-box {
	width:100%;
	margin-right:0;
	margin-bottom:12px;
	}
	
	.lightbox-popup .box-image {
	max-width:100%;	
	}
	
	.lightbox-popup .box-text {
	float:left;
	max-width:100%;
	margin-top:24px;	
	}
			
}


@media screen and (max-width: 520px) {
	
	/* Image boxes */
	.image-boxes {}
	
		/* All Image boxes - 1 Column */
		.image-boxes.seven-column .image-box,
		.image-boxes.six-column .image-box,
		.image-boxes.five-column .image-box,
		.image-boxes.four-column .image-box,
		.image-boxes.three-column .image-box,
		.image-boxes.two-column .image-box {
		width:100% !important;
		margin-right:0% !important;
		margin-bottom:30px;
		}	
		
		
		.feature.image-boxes .image-box .title-over {
		font-size:24px;
		line-height:70px;	
		}
	
}