@font-face {
    font-family: 'Museo700';
    src: url('../fonts/museo700-regular-webfont.eot');
    src: url('../fonts/museo700-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/museo700-regular-webfont.woff') format('woff'),
         url('../fonts/museo700-regular-webfont.ttf') format('truetype'),
         url('../fonts/museo700-regular-webfont.svg#Museo700') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'Museo500';
    src: url('../fonts/museo500-regular-webfont.eot');
    src: url('../fonts/museo500-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/museo500-regular-webfont.woff') format('woff'),
         url('../fonts/museo500-regular-webfont.ttf') format('truetype'),
         url('../fonts/museo500-regular-webfont.svg#Museo500') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'Museo300';
    src: url('../fonts/museo300-regular-webfont.eot');
    src: url('../fonts/museo300-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/museo300-regular-webfont.woff') format('woff'),
         url('../fonts/museo300-regular-webfont.ttf') format('truetype'),
         url('../fonts/museo300-regular-webfont.svg#Museo300') format('svg');
    font-weight: normal;
    font-style: normal;

}

body{
		background:#666;
		margin:0;
		padding:0;
		font:10pt Helvetica,Arial, sans-serif;
	}
	
	#container{
		width:900px;
		margin:0 auto;
		background:#ccc;
	}
	
	#header{
		height:125px;
		background:#06f;
		position:relative;
	}
	
	#middle{
		padding:20px 50px;
	}
	
	h1{
		color:#fff;
		font:20pt 'Museo700',Helvetica,sans-serif;
		top:40px;
		left:50px;
		margin:0;
		position:absolute;
	}
	
	h2{
		font:14pt 'Museo500',Helvetica,sans-serif;
		clear:both;
	}
	
	h3{
		font:12pt 'Museo300',Helvetica,sans-serif;
		margin-top:0;
	}

	form:after{
		content: ".";
    	display: block;
    	height: 0;
    	clear: both;
    	visibility: hidden;
	}
	
	.gallery{
		background:#999;
		width:780px;
		height:570px;
		padding:10px;
		text-align:center;
		position:relative;
		overflow:hidden;
	}

	.buttons{
		position:absolute;
		right:10px;
		bottom:10px;
	}

	.buttons a, a.button{
		cursor:pointer;
		display:inline-block;
		padding:5px;
		text-align:center;
		margin-left:3px;
		background:#666;
		color:#fff;
		font-weight:bold;
	}

	a.button.current{
		background:#06f;
	}

	.guggenheim-item{
		width:155px;
		height:225px;
		background:#06f;
		padding:10px;
		margin:10px 20px 10px 0;
		color:#fff;
		
		font:12pt 'Museo700',Helvetica,sans-serif;
	}

	.filter-set{
		width:150px;
		float:left;
	}

	.filter-set.double{
		width:304px;
	}

	.filter-set label{
		width:150px;
		display:inline-block;
	}
		
	hr{
		margin:40px 20px;
		border:none;
		height:1px;
		background:#666;
	}


.sprite {width:155px; height:226px; display:inline-block; overflow:hidden; background-repeat: no-repeat;background-image:url("../img/spritesheet.png");}

.antman {background-position: -2px -2px}
.batman {background-position: -159px -2px}
.captain-america {background-position: -316px -2px}
.colossus {background-position: -473px -2px}
.cyclops {background-position: -630px -2px}
.flash {background-position: -787px -2px}
.gambit {background-position: -2px -230px}
.green-lantern {background-position: -159px -230px}
.hawkeye {background-position: -316px -230px}
.hawkman {background-position: -473px -230px}
.hulk {background-position: -630px -230px}
.human-torch {background-position: -787px -230px}
.invisible-woman {background-position: -2px -458px}
.iron-man {background-position: -159px -458px}
.jean-grey {background-position: -316px -458px}
.martian-manhunter {background-position: -473px -458px}
.mr-fantastic {background-position: -630px -458px}
.nightcrawler {background-position: -787px -458px}
.nightwing {background-position: -2px -686px}
.professor-x {background-position: -159px -686px}
.rogue {background-position: -316px -686px}
.scarlet-witch {background-position: -473px -686px}
.spiderman {background-position: -630px -686px}
.storm {background-position: -787px -686px}
.superman {background-position: -2px -914px}
.thing {background-position: -159px -914px}
.thor {background-position: -316px -914px}
.wasp {background-position: -473px -914px}
.wolverine {background-position: -630px -914px}
.wonder-woman {background-position: -787px -914px}

