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

/**********************/
/*   simple resets    */
/**********************/
body, nav, main, ul, li,
h1, h2, h3, h4, h5, h6,
p, div, figure, hr, 
details, summary {
	margin:0;
	padding:0;
}

ul {
	list-style:none;
}

*, *:after, *:before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.clearfix:before, .clearfix:after {
	content:" ";
	display:table;
}

.clearfix:after {
	clear:both;
}
/*** end of resets ***/


/**********************/
/*      layout        */
/**********************/

body {
	background-color:black;
	width:100%;
}

header, main, footer {
	width:100%;
}

section {
	width:94%; 
	height:1rem; 
	margin:0 auto;
}

div.spriteCore {
	width:47%;
	height:0;
	float:left;
	margin-right:5%;
	padding-bottom:53%;
	background-position:0 0;
	background-size:200%;
	background-repeat:no-repeat;
	display:block;
}

/*div.spriteCore:hover {
	background-position:100% 0;
}*/

#secondSprite,
#fourthSprite,
#lastSprite {
	margin-right:0;
}

div#exhibs {
	color:white; 
	clear:both;
	display:block;
	height:5rem;
	width:100%;
	text-align:center; 
	font-size:0.75rem;
	margin:0;
}

/**********************/
/*    typography      */
/**********************/

html {
	font-family:Verdana, Helvetica, Arial, sans-serif;
	font-size:16px;
}

.menuText {

}

/**********************/
/*      images        */
/**********************/

img {
	width:100%;
	height:auto;
}

header img {
	clear:both;
	width:42.5%;
	display:block;
	margin:1rem auto;
}

footer img {
	clear:both;
	width:55%;
	display:block;
	padding:0 0 6%;
	margin:0 auto;
}

/*div.sprite01 {
	background-image:url(../images/sprites/front1sprite.jpg);
}

div.sprite02 {
	background-image:url(../images/sprites/front2sprite.jpg);
}

div.sprite03 {
	background-image:url(../images/sprites/front3sprite.jpg);
}

div.sprite04 {
	background-image:url(../images/sprites/front4sprite.jpg);
}

div.sprite05 {
	background-image:url(../images/sprites/front5sprite.jpg);
}

div.sprite06 {
	background-image:url(../images/sprites/front6sprite.jpg);
}*/

@media screen 
	and (orientation:landscape) {		/* landscape */

	/**********************/
	/*      layout        */
	/**********************/	
	
	div.spriteCore {
		width:15.8333%;
		margin-right:1%;
		padding-bottom:16%;
	}
	
	#secondSprite,
	#fourthSprite {
		margin-right:1%;
	}
			
	#lastSprite {
		margin-right:0;
	}

	/**********************/
	/*      images        */
	/**********************/

	header img {
		width:25%;
	}
	
	footer img {
		width:40%;
		padding:2.5% 0;
	}

}

@media screen 
	and (device-width:768px)
	and (device-height:1024px)
	and (orientation:portrait) {		/* iPad portrait */

	/**********************/
	/*      layout        */
	/**********************/
	
/*	div#exhibs {
		font-size:1rem;
		color:yellow;
	}*/

	div.spriteCore {
		width:31.666%;
		margin-right:2.2%;
		margin-bottom:2.2%;
		padding-bottom:32%;
	}	
	
	#secondSprite,
	#fourthSprite {
		margin-right:2.2%;
	}

	#thirdSprite {
		margin-right:0;
	}	

	/**********************/
	/*      images        */
	/**********************/

	header img {
		width:28%;
		margin:8% auto 6%;
	}
	
	footer img {
		width:28%;
		padding:6% 0 0;
	}	


	
}

@media screen 
	and (device-width:768px)
	and (device-height:1024px)
	and (orientation:landscape) {		/* iPad landscape */

	/**********************/
	/*      images        */
	/**********************/

	header img {
		width:20%;
		margin:8% auto 6%;
	}
	
	footer img {
		width:28%;
		padding:6% 0 0;
	}	
	
}

@media screen 
	and (min-width:1224px) {	/* desktop */

	/**********************/
	/*      images        */
	/**********************/

	header img {
		width:20%;
		margin:7% auto 5%;
	}
	
	footer img {
		width:28%;
		padding:2% 0 0;
	}	

	div#exhibs {
		padding-top:1rem;
		font-size:1.25rem;
		height:6rem;
	}
}