@charset "utf-8";
/* CSS Document */

/****************************************
*	Beloit College - Asset & Image CSS	*
*	By: Nick Mischler					*
*****************************************/

	div#assetImages {
		width: 100%;	
		display: inline-block;
		margin-bottom: 2em;
		clear: both;
	}
	
	div#assetImages div.assetImage {
		margin: 0 auto 1.5em;
		width: 100%;
		position: relative;
	}
	
	div#assetImages div.assetImage a {
		display: inline-block;
		position: absolute;
		height: 100%;
		width: 100%;
	}
	
	div#assetImages div.assetImage div.aiTitle {
		margin-bottom: 0.5em;
	}
	
	div#assetImages div.assetImage div.aiTitle p {
		font-weight: bold;
		margin: 0em;
	}
	
	div#assetImages div.assetImage div.aiTitle.withCheckmark img.aiCheckmark {
		height: 2em;
		width: auto;
		margin: 0 1em 0 0;
		float: left;
	}
	
	div#assetImages div.assetImage div.aiTitle.withCheckmark p {
		height: 2em;
		padding: 0.25em 0;
	}
	
	div#assetImages div.assetImage img {
		width: 100%;
		margin: 0 auto;
	}
	
	div#assetImages div.aiMp3 div.aiTitle,
	div#assetImages div.aiMp3 div.aiImageWrapper,
	div#assetImages div.aiMp3 div.aiDesc {
		position: relative;
	}
	
	div#assetImages div.aiMp3 div.playerWrapper {
		padding: 2px 0;
	}
	
	div#assetImages div.aiMp3 div.playerWrapper div.player {
		margin: 0 auto;
	}
	
	@media screen and (min-width: 600px){
		
	div#assetImages div.assetImage {
		width: 48%;
		margin: 0 1% 1.5em;
		float: left;
	}
	
	div#assetImages div.assetImage p.aiDesc {
		min-height: 4em;
	}
	
	div#assetImages div.assetImage.fourColumn {
		width: 31.33%;
		margin: 0 1% 1.5em;
	}	
			
	}
	
	/* 2-column to with nav */
	/*@media screen and (min-width: 1024px){
	div#assetImages div.assetImage.fourColumn {
		width: 48%;
		margin: 0 1% 1.5em;
	}
	}*/
	
	@media screen and (min-width: 1200px){
	div#assetImages div.assetImage.fourColumn {
		width: 23.6%;
		margin: 0 0.7% 1.5em;
	}	
	}
	
	@media screen and (min-width: 1460px){
		
	div#assetImages div.assetImage {
		width: 31.33%;
		margin: 0 1% 1.5em;
	}
		
	}