/**
* INKY&ME 
* -------
* Design: T. Wendel
* Code: M. Yasuda
*/

* , h1 , h2 , h3 , h4 , h5 , h6 , p {
	font-family: 'Open Sans',arial,verdana,sans-serif;
	color: #000;
	margin: 0px;
	padding: 0px;
	border: none;
}

a {
	text-decoration: none;
	cursor:pointer;
}

a.outbound {
	text-decoration: underline;
}

h3 {
	font: 300 26px/34px 'Open Sans',arial,verdana,sans-serif;
	border-bottom: solid 1px #333;
}

hr {
	display:none;
}

p.chromeframe {
	position:relative;
	top: 0px;
	padding: 2px;
	background: white;
	text-align: center;
	font-size: 0.8em;
}

#oc {
	position: relative;
	text-align: center;
	background: black;
    overflow: hidden;
    min-width: 965px;
}

#mc {
	position: relative;
	width: 965px;
	margin: 0px auto;
	text-align: left;
}

header {
	position: relative;
	z-index:10;
	top: 0px;
	left: 0px;
	width: 965px;
	height: 120px;
}

	#logo {
		position: absolute;
		z-index: 20;
		height: 120px;
		width: 330px;
		background: transparent url(../img/logo.png) 50px 45px no-repeat scroll;
	}

	#logo h1 {
		display: none;
	}

	#nav {
		position: absolute;
		z-index: 20;
		bottom: 0px;
		right: 20px;
		font: 400 14px/26px 'Open Sans',arial,verdana,sans-serif;
		color: white;
		text-shadow: 
		   -1px -1px 0 #000,  
		    1px -1px 0 #000,
		    -1px 1px 0 #000,
		     1px 1px 0 #000;
	}

	#nav a {
		color: inherit;
	}

	#nav a:active {
		outline: 0;
	}

#ic {	
	position: relative;
	z-index: 2;
}

	.bag {
		position: relative;
		width: 965px;
		height: 1545px;
		margin-bottom: 10px;
		background: #eee;
	}

	.bag_preview , .bag_preview img {
		position: absolute;
		z-index: 3;
		width: 965px;
		height: 1545px;
	}

	.bag_preview img {
		display: none;
	}

	.bag_preview img.queued , .bag_preview img.active {
		display: block;
		z-index: 3;
	}

	.bag_preview img.active {
		z-index: 4;
	}

	.no-js .bag_preview_controls div {
		display:none;
	}

	.bag_preview_controls div {
		position: absolute;
		z-index: 20;
		top: 800px;
		left: 40px;
		width: 24px;
		height: 47px;
		padding: 40px;
		cursor: pointer;
	}

	.bag_preview_controls div span {
		display: block;
		width: 24px;
		height: 47px;
		background: transparent url(../img/controls.png) 0px 0px no-repeat scroll;
	}

	.bag_preview_controls div.nx {
		left:805px;
	}

	.bag_preview_controls div.nx span {
		background-position: -24px 0px;
	}

	.bag_preview_controls .idx {
		position: absolute;
		z-index: 20;
		top: 1340px;
		left: 0px;
		width: 100%;
		height: 20px;
		list-style: none;
		text-align: center;
	}

	.bag_preview_controls .idx li {
		display: inline-block;
		width: 11px;
		height: 11px;
		margin: 0px 2px;
		padding: 4px 5px;
		cursor: pointer;
	}

	.bag_preview_controls .idx li span {
		display: block;
		width: 11px;
		height: 11px;
		background: transparent url(../img/controls.png) -48px 0px no-repeat scroll;
	}

	.bag_preview_controls .idx li.active span {
		background-position: -48px -11px;
	}

	h2 {
		position: absolute;
		z-index: 6;
		top: 150px;
		left: 70px;
		margin: 0px;
		padding: 0px;
		font-weight: 800;
		font-size: 180px;
		line-height: 150px;
	}

	h2 span {
		position: absolute;
		color:#000;
	}

	.bag_coords {
		position: absolute;
		z-index: 6;
		top: 280px;
		left: 69px;
		font-weight: 700;
		font-size: 13px;
	}

	.bag_intro {
		position: absolute;
		z-index: 6;
		top: 280px;
		left: 600px;
		width: 275px;
		font-weight: 700;
		font-size: 13px;
		line-height: 18px;
		background: transparent url(../img/asterix.png) top left no-repeat scroll;
		padding-left: 20px; 
	}

	.bag_detail {
		position: absolute;
		z-index:  6;
		bottom: 0px;
		width: 965px;
		height: 250px;
	}

	.bag_detail div.two , .bag_detail div.three , .bag_detail div.four {
		float: left;
		margin-left: 30px;
		height: 320px;
		background: transparent;
	}

	.bag_detail div.two {
		width: 201px;
	}

	.bag_detail div.three {
		width: 302px;
	}

	.bag_detail div.four {
		width: 403px;
	}

	.bag_detail div:first-child {
		margin-left: 50px;
	}

	.bag_detail h3 {
		margin-bottom: 12px;
	}

	.bag_detail div.gal {
		margin-top: 15px;
	}

	.bag_detail div.gal a {
		display: block;
		float:left;
		height: 100px;
		width: 100px;
		margin: 1px 1px 0px 0px;
	}

	.bag_detail div.gal a:active {
		outline: 0;
	}

	.bag_detail div.gal img {
		display: block;
		height: 100px;
		width: 100px;
	}

	.bag_detail div.gal a.last {
		margin: 1px 0px 0px 0px;
	}

	.bag_detail h3 b {
		font-weight:400;
	}
	.bag_detail_de p {
		font: 400 12px/16px 'Open Sans',arial,verdana,sans-serif;
		margin: 5px 0px;
	} 

	.bag_detail_desc p {
		line-height: 16px;

	}

	/* PER BAG OVERRIDES */
	.bag.ara {height:1760px;}
	.bag.ara .bag_preview , .bag.ara .bag_preview img {height:1760px;}
	.bag.ara .bag_detail {height:327px;}
	.bag.ara .bag_detail div {height:327px;}

	.bag.pavo h2 span {top:-20px;left: -14px;letter-spacing: -19px;}
	.bag.pavo .bag_detail {height:211px;}
	.bag.pavo .bag_detail div {height:211px;}

	.bag.leda h2 span {top: 180px;left: -14px;letter-spacing: -15px;}
	.bag.leda .bag_coords {top: 480px;}
	.bag.leda .bag_intro {top: 480px;}
	.bag.leda .bag_detail {height:302px;}
	.bag.leda .bag_detail div {height:302px;}
	/* END OVERRIDES */

	/* PER BAG TITLE */
	.bag.ara h2 {width: 440px;height: 124px;background-image:url(../img/bag/ara/title.png);}
	.bag.pavo h2 {width: 503px;height: 130px;background-image:url(../img/bag/pavo/title.png);}
	.bag.leda h2 {top: 350px;width: 500px;height: 124px;background-image:url(../img/bag/leda/title.png);}
	.bag h2 span {display:none;}
	/* END TITLE */


#cc_screen {
	display:none;
	position: fixed;
	z-index: 30;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	background: transparent url(../img/trans_black.png) top left repeat scroll;
	opacity:0.7;
}


.no-js #cc {
	/*display:none;*/
	position: relative;
	z-index: 31;
	top: -20px;
	width: 965px ;
	margin: 0px auto 10px;
}
.js #cc {
	display: none;
	position: fixed;
	z-index: 31;
	top: 120px;
	width: 965px ;
	margin: 0px auto;
}

#ccic {
	position: relative;
	width: 965px;
	background: #f2f2f2;
	text-align: left;
	padding: 40px 0px;
}

	.js #close_btn {
		display: block;
		position: absolute;
		z-index: 33;
		top: 15px;
		right: 15px;
		width: 14px;
		height: 14px;
		background: transparent url(../img/controls.png) -107px 0px no-repeat scroll;
	}

	#ccic h4 {
		margin: 0px 70px;
		border-bottom: none;
	}

	#ccic form {
		margin: 0px 50px 20px;
	}

	#ccic form * {
		font: 400 13px/18px 'Open Sans',arial,verdana,sans-serif;
	}

	#ccic textarea {
		width: 825px;
		height: 200px;
		margin-bottom: 1px;
		padding: 15px 20px;
		background: #ddd;
	}

	#ccic input {
		width: 720px;
		margin-right: 1px;
		padding: 10px 20px;
		background: #ddd;
	}

	#ccic button {
		width: 104px;
		padding: 10px;
		background: #ddd;
		outline: 0;
	}	

#cc_msg {
	position: relative;
	width: 965px;
	background: #f2f2f2;
	text-align: left;
	padding: 40px 0px;
	margin-bottom: 10px;
}

#cc_msg_ic {
	margin:0px 50px;
	font: 400 13px/18px 'Open Sans',arial,verdana,sans-serif;
}

.js #cc_msg_close_btn {
	display: block;
	position: absolute;
	z-index: 33;
	top: 15px;
	right: 15px;
	width: 14px;
	height: 14px;
	background: transparent url(../img/controls.png) -107px 0px no-repeat scroll;
}

footer {
	position: relative;
	z-index: 20;
	background:#f2f2f2;
}


#fc {
	margin: 0px 70px 30px;
	padding: 40px 0px;
	text-align: left;
}

#fc p {
	margin: 10px 0px;
	font: 400 13px/18px 'Open Sans',arial,verdana,sans-serif;
}

/* fluff */
#bg_uni {
	position: absolute;
	z-index: 0;
	top: 0px;
	width: 100%;
	height: 1286px;
	background: transparent url(../img/page/universe.jpg) center top no-repeat scroll;
}
#bg_moon {
	position: absolute;
	z-index: 0;
	bottom: 0px;
	width: 100%;
	height: 1146px;
	background: transparent url(../img/page/moon.jpg) center top no-repeat scroll;
}
.asteroid {
	position: absolute;
	z-index: 1;
	background: transparent url(../img/asteroids/1.jpg) center top no-repeat scroll;
}
#ast_1 {top: 1200px;left: -200px;width: 254px;height: 254px;background-image: url(../img/asteroids/1.jpg);}
#ast_2 {top: 2093px;left: -182px;width: 341px;height: 351px;background-image: url(../img/asteroids/2.jpg);}
#ast_3 {top: 2930px;right: -190px;width: 221px;height: 220px;background-image: url(../img/asteroids/3.jpg);}
#ast_4 {top: 1600px;right: -550px;width: 437px;height: 393px;background-image: url(../img/asteroids/4.jpg);}
#ast_5 {top: 3600px;left: -150px;width: 181px;height: 153px;background-image: url(../img/asteroids/5.jpg);}