.artcollthumbs .container-fluid {
  padding-right: 0px;
  padding-left: 0px;
  margin-right: 0;
  margin-left: 0;
}
/* ---- grid ---- */

.grud {
  
  max-width: 100%;
}

/* clear fix */
.grud:after {
  content: '';
  display: block;
  clear: both;
  outline: 0px solid #666;
}

/* ---- size later in media queries ---- */
/*
 .grid-sizer {
width: 354px;
height: 500px;
		}
*/

.figura {outline: 0px solid #444; page-break-inside: avoid;}
	.figura a, .figura a:link .figura a:visited, .figura a:hover, .figura a:active{background-color:#FFF !important;}
	
.thumbwrap {display:table;}
#artists {margin-top:0 !important}



 	.photon {
		display:table-cell;
		vertical-align:bottom;
		background:none;	
		height:400px;
		outline: 1px solid #FFF;
		page-break-inside: avoid;
		}

		.photon img {
			border: 1px solid #FFF;
			background-color: #FFF;
			padding:1px;
			position: relative;
			max-height:400px;
			max-width:300px;
			page-break-after: avoid;
			}
		.photon img:hover {
			border-left: 1px solid #FFF;
			border-top:1px solid #F2F2F2;
			-webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
			   -moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
					box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
			}	
		
div.captionbox
{
	height: 80px;
	margin-top: 10px;
	width:300px !important;
	page-break-inside: avoid;
}		

	div.captionbox h4.captionz {margin-bottom: 0 !important;max-width:300px !important;}
	div.captionbox p.captionz {margin-top: 0 !important;max-width:300px !important; display:inline !important;}
	

/* Responsive columns and sidebar toggle adjustment ----------- */

@media print {
	div{
			page-break-inside: avoid;
		}
	.figura {
	float:left;
	}	
	.photon {	
		height:500px;
		outline: 0px solid #FFF;
		page-break-inside: avoid;
		}
 	.photon img {
		width: 200px;
		}
			
	a[href]:after {
		content: none !important;
	}
}

/* Smartphones (portrait) ----------- */
@media only screen 
and (min-width : 320px) 
and (max-width : 379px) {
	.grid-sizer {
	width: 100%;
	height: 500px;
	}

}

/* Smartphones (landscape) ----------- */
@media only screen 
and (min-width : 380px) {
	.grid-sizer {
	width: 324px;
	height: 500px;
	}
	.grid-sizer.toggled {
	width: 100%;
	height: 500px;
	}
}

/* Smartphones (iphone plus portrait) ----------- */
@media only screen 
and (min-width : 410px) 
and (max-width : 661px) {
	.grid-sizer {
	width: 100%;
	height: 500px;
	}

}

/* Smartphones (iphone plus landscape) ----------- */
@media only screen 
and (min-width : 662px) 
and (max-width : 740px) {
	.grid-sizer {
	width: 50%;
	height: 500px;
	}
	.grid-sizer.toggled {
	width: 100%;
	height: 500px;
	}
}

/* iPad mini basic (portrait) ----------- */
@media only screen 
and (min-width : 768px) 
and (max-width : 1023px) {
	.grid-sizer {
	width: 50%;
	height: 500px;
	}
}

/* iPads (landscape) ----------- */
@media only screen 
and (min-width : 1024px) 
and (max-width : 1280px)  {
	.grid-sizer {
	width: 33%;
	height: 500px;
	}
	.grid-sizer.toggled {
	width: 50%;
	height: 500px;
	}	
}

@media only screen 
  and (min-width: 1280px) 
  and (max-width: 1366px)  {
  
  	.grid-sizer {
	width: 25%;
	height: 500px;
	}
	.grid-sizer.toggled {
	width: 33%;
	height: 500px;
	}

}

@media screen 
  and (min-width: 1367px) 
  and (max-width: 1429px) 
 { 
  	.grid-sizer {
	width: 25%;
	height: 500px;
	}
	.grid-sizer.toggled {
	width: 33%;
	height: 500px;
	}  
}

/* Large screens ----------- */
@media only screen 
and (min-width : 1430px)
and (max-width: 1629px) {
	.grid-sizer {
	width: 25%;
	height: 500px;
	}
	.grid-sizer.toggled {
	width: 33%;
	height: 500px;
	}	
}
/* Large screens ----------- */
@media only screen 
and (min-width : 1630px) {
	.grid-sizer {
	width: 20%;
	height: 500px;
	}
		.grid-sizer.toggled {
	width: 25%;
	height: 500px;
	}
}
