.zoogallery-lists{ margin-left:-2%; }
.zoogallery_cl_2{ width:48%; }
.zoogallery_cl_3{ width:31.33333%; }
.zoogallery_cl_4{ width:23%; }
.zoogallery_cl_5{ width:18%; }
.zoogallery_cl_6{ width:14.66666%; }
.zoogallery_cl_7{ width:12.28571%; }
.zoogallery_cl_8{ width:10.50%; }
.zoogallery-img-list{ margin-left:2%; margin-bottom:2%; float:left; position:relative; overflow:hidden; line-height:0; }


.zoogallery-img-list .overlly a{ 
	position:absolute; height:100%; 
	width:100%; 
	background-color:rgba(192, 81, 7, 0.59);
	background-image:url(../images/zoogallery/preview-icon.png);
	background-position:center center;
	background-repeat:no-repeat;
	opacity:0;
	color:#FFF;
	text-align:center;
	text-decoration:none;
	vertical-align:middle;
	 
	-webkit-transition-duration: .4s, .3s;  
	-moz-transition-duration: .4s, .3s;  
	-o-transition-duration: .4s, .3s; 
	transition-duration: .4s, .3s;         
	-webkit-transition-timing-function: linear, ease-in; 
	-moz-transition-timing-function: linear, ease-in;
	-o-transition-timing-function: linear, ease-in; 
	transition-timing-function: linear, ease-in; 
}
.zoogallery-img-list:hover .overlly a{ opacity:1; }

.zoogallery-img-list img{ width:100%; }


/*----------------*/


.zoogallery-archive-list{ margin-left:2%; margin-bottom:2%; float:left; position:relative;  }
.zoogallery-archive-list .overlly{ 
	position:absolute; 
	width:100%; 
	height:auto;
	background-color:rgba(0, 0, 0, 0.4);
	color:#FFF;
	text-align:center;
	text-decoration:none;
	bottom:0;
	left:0;
	padding:10px 0;
	 
	-webkit-transition-duration: .4s, .3s;  
	-moz-transition-duration: .4s, .3s;  
	-o-transition-duration: .4s, .3s; 
	transition-duration: .4s, .3s;         
	-webkit-transition-timing-function: linear, ease-in; 
	-moz-transition-timing-function: linear, ease-in;
	-o-transition-timing-function: linear, ease-in; 
	transition-timing-function: linear, ease-in; 
}
.zoogallery-archive-list:hover .overlly{ background-color:rgba(0, 0, 0, 0.7); }





.zoogallery_clear{ margin:0; padding:0; height:1px; width:100%; clear:both; }



/* #Tablet (Portrait)
================================================== */
/* Note: Design for a width of 768px */
@media only screen and (min-width: 768px) and (max-width: 959px) {		
	.zoogallery_cl_2{ width:47%; }
	.zoogallery_cl_3{ width:30.33333%; }
	.zoogallery_cl_4{ width:30.33333%; }
	.zoogallery_cl_5{ width:30.33333%; }
	.zoogallery_cl_6{ width:30.33333%; }
	.zoogallery_cl_7{ width:30.33333%; }
	.zoogallery_cl_8{ width:30.33333%; }
}

	
/*  #Mobile (Portrait)
================================================== */
/* Note: Design for a width of 320px */
@media only screen and (max-width: 767px) {
	.zoogallery_cl_2{ width:97%; }
	.zoogallery_cl_3{ width:97%; }
	.zoogallery_cl_4{ width:97%; }
	.zoogallery_cl_5{ width:47%; }
	.zoogallery_cl_6{ width:47%; }
	.zoogallery_cl_7{ width:47%; }
	.zoogallery_cl_8{ width:47%; }
}
	

/* #Mobile (Landscape)
================================================== */
/* Note: Design for a width of 480px */
@media only screen and (min-width: 480px) and (max-width: 767px) {
	.zoogallery_cl_2{ width:97%; }
	.zoogallery_cl_3{ width:47%; }
	.zoogallery_cl_4{ width:47%; }
	.zoogallery_cl_5{ width:47%; }
	.zoogallery_cl_6{ width:47%; }
	.zoogallery_cl_7{ width:47%; }
	.zoogallery_cl_8{ width:47%; }
}