/*
	The responsive design statements for ImageGridContainer have been generated by using the file ImageGridCSS.asp.
	If the image cell width gets changed in the search results, then you'll have to regenerated this file.
	Otherwise the search results may not be centered.
	The responsive design statements can be generated by using the file ImageGridCSS.asp located in the CSS folder.
	If the file isn't there, then you can get a copy of it from the Template Site in its CSS folder.
	The file contains instructions on how to use it.
*/
#ImageGridContainer {margin: 0 auto; margin-top: 20px}
@media only screen and (max-width: 10574px) {#ImageGridContainer {width: 10212px;}}
@media only screen and (max-width: 10352px) {#ImageGridContainer {width: 9990px;}}
@media only screen and (max-width: 10130px) {#ImageGridContainer {width: 9768px;}}
@media only screen and (max-width: 9908px) {#ImageGridContainer {width: 9546px;}}
@media only screen and (max-width: 9686px) {#ImageGridContainer {width: 9324px;}}
@media only screen and (max-width: 9464px) {#ImageGridContainer {width: 9102px;}}
@media only screen and (max-width: 9242px) {#ImageGridContainer {width: 8880px;}}
@media only screen and (max-width: 9020px) {#ImageGridContainer {width: 8658px;}}
@media only screen and (max-width: 8798px) {#ImageGridContainer {width: 8436px;}}
@media only screen and (max-width: 8576px) {#ImageGridContainer {width: 8214px;}}
@media only screen and (max-width: 8354px) {#ImageGridContainer {width: 7992px;}}
@media only screen and (max-width: 8132px) {#ImageGridContainer {width: 7770px;}}
@media only screen and (max-width: 7910px) {#ImageGridContainer {width: 7548px;}}
@media only screen and (max-width: 7688px) {#ImageGridContainer {width: 7326px;}}
@media only screen and (max-width: 7466px) {#ImageGridContainer {width: 7104px;}}
@media only screen and (max-width: 7244px) {#ImageGridContainer {width: 6882px;}}
@media only screen and (max-width: 7022px) {#ImageGridContainer {width: 6660px;}}
@media only screen and (max-width: 6800px) {#ImageGridContainer {width: 6438px;}}
@media only screen and (max-width: 6578px) {#ImageGridContainer {width: 6216px;}}
@media only screen and (max-width: 6356px) {#ImageGridContainer {width: 5994px;}}
@media only screen and (max-width: 6134px) {#ImageGridContainer {width: 5772px;}}
@media only screen and (max-width: 5912px) {#ImageGridContainer {width: 5550px;}}
@media only screen and (max-width: 5690px) {#ImageGridContainer {width: 5328px;}}
@media only screen and (max-width: 5468px) {#ImageGridContainer {width: 5106px;}}
@media only screen and (max-width: 5246px) {#ImageGridContainer {width: 4884px;}}
@media only screen and (max-width: 5024px) {#ImageGridContainer {width: 4662px;}}
@media only screen and (max-width: 4802px) {#ImageGridContainer {width: 4440px;}}
@media only screen and (max-width: 4580px) {#ImageGridContainer {width: 4218px;}}
@media only screen and (max-width: 4358px) {#ImageGridContainer {width: 3996px;}}
@media only screen and (max-width: 4136px) {#ImageGridContainer {width: 3774px;}}
@media only screen and (max-width: 3914px) {#ImageGridContainer {width: 3552px;}}
@media only screen and (max-width: 3692px) {#ImageGridContainer {width: 3330px;}}
@media only screen and (max-width: 3470px) {#ImageGridContainer {width: 3108px;}}
@media only screen and (max-width: 3248px) {#ImageGridContainer {width: 2886px;}}
@media only screen and (max-width: 3026px) {#ImageGridContainer {width: 2664px;}}
@media only screen and (max-width: 2804px) {#ImageGridContainer {width: 2442px;}}
@media only screen and (max-width: 2582px) {#ImageGridContainer {width: 2220px;}}
@media only screen and (max-width: 2360px) {#ImageGridContainer {width: 1998px;}}
@media only screen and (max-width: 2138px) {#ImageGridContainer {width: 1776px;}}
@media only screen and (max-width: 1916px) {#ImageGridContainer {width: 1554px;}}
@media only screen and (max-width: 1694px) {#ImageGridContainer {width: 1332px;}}
@media only screen and (max-width: 1472px) {#ImageGridContainer {width: 1110px;}}
@media only screen and (max-width: 1250px) {#ImageGridContainer {width: 888px;}}
@media only screen and (max-width: 1028px) {#ImageGridContainer {width: 666px;}}
@media only screen and (max-width: 806px) {#ImageGridContainer {width: 444px;}}
@media only screen and (max-width: 584px) {#ImageGridContainer {width: 222px;}}
@media only screen and (max-width: 480px) {#ImageGridContainer {width: 222px; margin-top: 35px;}}

/* Layout used in the file classresultsgrid.asp.
   For the Div Layout, the thumbnail images are left-aligned for
   Desktop and center-aligned for Mobile.
===================================================================== */
.iconsdiv {
	/* Contains the Icons for Desktop */
	display: none;
}
.iconsdivIPad {
	/* Contains the Icons for IPad */
	display: block;
}
.iconsdivTablet {
	/* Contains the Icons for Tablet */
	display: none;
}

.imageresultsdiv {
	height: 410px;
}

.innerimagediv {
	position: relative;
}
 .helper { display:inline-block; height:100%; vertical-align:bottom; }
 
/* classresultsgrid.asp */
@media only screen and (min-width: 1025px) {
	.imageresultsdiv {
		height: 410px;
	}
}

@media only screen and (max-width: 1024px) {
	.iconsdiv {display: none;}
	.iconsdivIPad {display: block;}

	.imageresultsdiv {
		height: 410px;
	}
}
@media only screen and (max-width: 767px) {
	.iconsdivIPad {display: none;}
	.iconsdivTablet {display: block;}
}


/* Layout used for the search nav links located above and below a
   search result.
===================================================================== */
/* jsresultsnav.asp */
#resultsNavTop {width: 100%; height: 30px; margin:0 auto; font-size: 85%;}
#resultsDescription {float: left;}
#browseToPageNum {float: right;}
#browseToPageNum2 {float: right; font-size: 85%;}

.resultsNavLinksTablet {display: none;}
.resultsNavLinksMobile {display: none;}

@media only screen and (max-width: 1024px) {
	.resultsNavLinks {display: none;}
	.resultsNavLinksTablet {display: block;}
	}

@media only screen and (max-width: 767px) {
	#resultsNavTop {height: 40px;}
	.resultsNavLinksTablet {display: none;}
	.resultsNavLinksMobile {display: block;}
	}

@media only screen and (max-width: 640px) {
	.resultsNavLinksGoToPage {display: none;}
}

@media only screen and (max-width: 480px) {
	#resultsNavTop {height: 60px;}
	#resultsDescription {float: none; width: 100%; text-align: center;}
	#browseToPageNum {float: none; margin: 0 auto; text-align: center;}
	#browseToPageNum2 {float: none; margin: 0 auto; text-align: center;}
	#searchHeaderContainer {float: none; margin: 0 auto; text-align: center;}

	.innerimagediv { position: relative; vertical-align: middle; }
	.overlayrow { display: none; }
	.iconsrow { display: none; }
	.imageresultsdiv { height: 220px; }
	.helper { display:inline-block; height:100%; vertical-align:middle; }
}

@media (webkit-min-device-pixel-ratio: 2.0), (min-resolution: 720dpi) {
	#resultsNavTop {height: 60px;}
	#resultsDescription {float: none; width: 100%; text-align: center;}
	#browseToPageNum {float: none; margin: 0 auto; text-align: center;}
	#browseToPageNum2 {float: none; margin: 0 auto; text-align: center;}
	#searchHeaderContainer {float: none; margin: 0 auto; text-align: center;}

	.innerimagediv { position: relative; vertical-align: middle; }
	.overlayrow { display: none; }
	.iconsrow { display: none; }
	.imageresultsdiv { height: 230px; }
	.helper { display:inline-block; height:100%; vertical-align:middle; }
}
