body, html {
	margin: 0;
	padding: 0;
	border: none;
	width: 100%;
	height: 100%;
	overflow-x: hidden;
	background-color: #fffcf7;
}

::selection { background:#ff7c2d; color:#fff; }
::-moz-selection { background:#ff7c2d; color:#fff; }
::-webkit-selection { background:#ff7c2d; color:#fff; }

img { border: 0; }

/* FONTS */
@font-face {
    font-family: 'Ernest';
    src: url('../fonts/ernest-webfont.eot');
    src: url('../fonts/ernest-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/ernest-webfont.woff') format('woff'),
         url('../fonts/ernest-webfont.ttf') format('truetype'),
         url('../fonts/ernest-webfont.svg#ErnestRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

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

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

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

.seo {
	visibility: hidden;
}

/* LOADING ICON*/
#grid_loader {
	position: absolute;
	width: 42px;
	height: 34px;
	left: 50%;
	top: 50%;
	margin-left: -21px;
	margin-top: -17px;
	background-image: url('../images/grid/loader.gif');
}

/* HEADER */
#header {
	position: fixed;
	width: 100%;
	height: 49px;
	background-image: url('../images/common/header-bg.png');
	z-index: 100;
	visibility: hidden;
}

	#header .dropdown {
		position: absolute;
		top: 37px;
		left: 0px;
		width: 119px;
		padding: 0;
		margin: 0;
		cursor: pointer;
		overflow: hidden;
	}
	
		#header .dropdown li {
			margin: 0;
			padding: 0;
			width: 102px;
			height: 18px;
			border: 1px solid #f5f3ef;
			border-top: none;
			list-style-type: none;
			background-color: #fdfaf5;
			font-family: 'Marvel';
			color: #644736;
			font-size: 14px;
			padding-left: 15px;
			padding-top: 5px;
			position: relative;
		}

	#header .options {
		position: absolute;
		left: 300px;
		height: 37px;
		width: 469px;
		top: 3px;
	}
	
		#header .dotted_line {
			display: block;
			width: 1px;
			height: 25px;
			background-repeat: no-repeat;
			background-image: url('../images/common/header-divide.png');
			float: left;
			margin-top: 5px;
		}
	
		#header .header_option {
			float: left;
			height: 37px;
			color: #7b6552;
			font-family: 'Marvel';
			font-size: 14px;
			background-color: #fdfaf5;
			cursor: pointer;
		}
		
		#header .sort {
			width: 175px;
		}
		
			#header .sort span {
				position: absolute;
				margin-top: 11px;
				margin-left: 15px;
			}
			
				.sortHover {
					color: #cfc5bc;
				}
			
			 	#header #release {
			 		margin-left: 68px !important;
			 	}
			 	
			 	#header #alpha {
			 		margin-left: 148px !important;
			 	}
			 	
			 	#header #web {
			 		margin-left: 86px !important;
			 	}
			 	
			 	#header #mobile {
			 		margin-left: 117px !important;
			 	}
			 	
			 	#header .select {
			 		color: #ff7c2d;
			 	}
		
		#header .platforms {
			width: 170px;
		}
		
			.platforms .desktop {
				width: 13px;
				height: 12px;
				margin-left: 85px;
				background-image: url('../images/common/platform-icons.png');
			}
			
			.platforms .mobile {
				width: 13px;
				height: 12px;
				margin-top: 11px !important;
				margin-left: 99px;
				background-position: 0 -16px;
				background-image: url('../images/common/platform-icons.png');
			}
		
			#header .platforms div {
				position: absolute;
				margin-top: 12px;
			}
		
			#header .platforms span {
				position: absolute;
				margin-top: 11px;
				margin-left: 15px;
			}
	
		#header .industries {
			width: 117px;
		}	
		
			.industries .mobile_hit_industry {
				position: absolute;
				top: 0;
				width: 117px;
				height: 37px;
				z-index: 10;
			}
		
			#header .industries span {
				position: absolute;
				margin-top: 11px;
				margin-left: 15px;
			}
			
				.industries .carrot {
					position: absolute;
					width: 7px;
					height: 4px;
					background-image: url('../images/common/header-carrot.png');
					margin-top: 15px;
					margin-left: 96px;
				}
				
				.white_carrot {
					background-position: 0 -10px;
				}

/* FOOTER */
#footer {
	width: 100%;
	bottom: -278px;
	background-color: #5f4333;
	background-image: url('../images/common/footer/footer-bg.jpg');
	height: 290px;
	position: fixed;
	visibility: hidden;
	z-index: 500;
}

	#footer .copyright {
		position: absolute;
		color: #a28c76;
		font-family: 'Arial';
		font-size: 12px;
		bottom: 25px;
		left: 1000px;
		z-index: 2;
	}
	
	#footer .tag {
		position: absolute;
		top: -22px;
		width: 70px;
		height: 17px;
		background-color: #694b39;
		color: #f3e9db;
		font-size: 12px;
		text-align: center;
		cursor: pointer;
		font-family: 'Marvel';
		letter-spacing: 1px;
		padding-top: 5px;
		right: 200px;
	}
	
	#footer .content {
		position: absolute;
		width: 941px;
		height: 250px;
		top: 30px;
		left: 130px;
	}
	
	#footer .left {
		float: left;
		margin-right: 29px;
	}
	
		#footer .logos {
			margin-top: 25px;
		}
		
			#footer .logos a {
				margin-right: 15px;
				float: left;
				display: block;
				font-size: 0px;
			}
			
				.logos .soda {
					width: 124px;
					height: 40px;
					background-image: url('../images/common/footer/soda.png');
				}  .logos .soda:hover { background-position: 0 -48px; }
				
				.logos .bannerblog {
					width: 120px;
					height: 23px;
					margin-top: 20px;
					background-image: url('../images/common/footer/bannerblog.png');
				}  .logos .bannerblog:hover { background-position: 0 -23px; }
				
				.logos .sleevage {
					width: 88px;
					height: 23px;
					margin-top: 20px;
					background-image: url('../images/common/footer/sleevage.png');
				}  .logos .sleevage:hover { background-position: 0 -23px; }
	
		#footer .follow_us {
			margin-top: 25px;
			height: 26px;
			width: 100%;
		}
		
		
			#footer .follow_us a {
				float: left;
				font-size: 0px;
				width: 21px;
				height: 21px;
				margin-top: 2px;
				margin-right: 5px;
			}
			
				#footer .follow_us a:hover { background-position: 0 -23px; }
			
			.follow_us .facebook { background-image: url('../images/common/footer/facebook.png'); }
			.follow_us .flickr { background-image: url('../images/common/footer/flickr.png'); }
			.follow_us .vimeo { background-image: url('../images/common/footer/vimeo.png'); }
			.follow_us .twitter { background-image: url('../images/common/footer/twitter.png'); }
			.follow_us .slideshare { background-image: url('../images/common/footer/slideshare.png'); }

	#footer em {
		font-style: normal;
		font-weight: bold;
	}
	
	#footer h1 {
		color: #f3e9db;
		margin: 0;
		padding: 0;
		font-size: 24px;
		font-weight: normal;
		text-transform: uppercase;
		font-family: 'PTSansBold';
		letter-spacing: 1px;
		margin-bottom: 10px;
	}
	
	#footer h2 {
		color: #ff7c2d;
		margin: 0;
		padding: 0;
		font-size: 24px;
		font-weight: normal;
		text-transform: uppercase;
		font-family: 'PTSansBold';
		letter-spacing: 1px;
		margin-bottom: 10px;
		width: 146px;
		float: left;
	}
	
		#footer span {
			display: block;
			color: #e5daca;
			font-family: 'Arial';
			font-size: 12px;
			line-height: 18px;
		}
		
		#footer .about span { width: 446px; }
		
		#footer .right {
			width: 465px;
			float: left;
		}
		
			#footer .right div {
				float: left;
				margin-right: 86px;
				margin-bottom: 45px;
			}
			
			#footer a {
				color: #e5daca;
				text-decoration: none;
			}
			
			#footer a:hover {
				color: #ff7c2d;
			}

/* CONTAINER */
#container {
	width: 200%;
	min-height: 100%;
	height: auto;
	background-image: url('../images/common/background.jpg');
	position: absolute;
	visibility: hidden;
	left: 0px;
	overflow: hidden;
}

/* PLAY */
#container .play {
	position: absolute;
	width: 100%;
	height: 100%;
	overflow-x: hidden;
	left: 50%;
}
	
	#flash {
		background-color: #fff;
		overflow: hidden;
	}
	
	.play .info {
		position: absolute;
		left: 300px;
		top: 720px;
		width: 700px;
	}
	
	.play h1 {
		margin: 0;
		padding: 0;
		font-family: 'PTSansBold';
		color: #ff7c2d;
		font-size: 20px;
		font-weight: normal;
		display: block;
		border-bottom: 1px dotted #b0b0b0;
		padding-bottom: 2px;
	}
	
	.play .info span {
		display: block;
		margin-top: 8px;
		font-family: 'PTSansItalic';
		font-size: 14px;
		color: #694b39;
	}

	.play .back {
		position: fixed;
		width: 188px;
		height: 50px;
		background-image: url('../images/play/back-bg.png');
		left: -32px;
		cursor: pointer;
		z-index: 500;
	}
	
		.back .backto {
			position: absolute;
			width: 62px;
			height: 12px;
			background-image: url('../images/play/back-backto.png');
			left: 41px;
			top: 19px;
		}
		
		.back .logo {
			position: absolute;
			width: 62px;
			height: 32px;
			background-image: url('../images/play/back-logo.png');
			left: 114px;
			top: 9px;
		}
		
		.back .arcade {
			background-image: url('../images/play/back-arcade.png') !important;
		}
		
	.holder {
		width: 700px;
		height: 600px;
		position: absolute;
		top: 100px;
		left: 300px;
	}
	
	.mobile_noflash {
		font-family: 'PTSansBold';
		width: 100%;
		padding-top: 10px;
		text-align: center;
	}
	
	.holder .soap_logo_holder {
		width: 166px;
		height: 84px;
		background-image: url('../images/play/soap_logo.png');
		position: absolute;
		top: 50%;
		left: 50%;
		margin-left: -83px;
		margin-top: -42px;
	}

	.holder .bg {
		width: 100%;
		height: 100%;
		background: #f8f5f1; /* Old browsers */
		background: -moz-linear-gradient(top,  #f8f5f1 0%, #fffcf7 100%); /* FF3.6+ */
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f8f5f1), color-stop(100%,#fffcf7)); /* Chrome,Safari4+ */
		background: -webkit-linear-gradient(top,  #f8f5f1 0%,#fffcf7 100%); /* Chrome10+,Safari5.1+ */
		background: -o-linear-gradient(top,  #f8f5f1 0%,#fffcf7 100%); /* Opera 11.10+ */
		background: -ms-linear-gradient(top,  #f8f5f1 0%,#fffcf7 100%); /* IE10+ */
		background: linear-gradient(top,  #f8f5f1 0%,#fffcf7 100%); /* W3C */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f8f5f1', endColorstr='#fffcf7',GradientType=0 ); /* IE6-9 */
		opacity: .5;
		-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
		filter: alpha(opacity=50);
		position: absolute;
		-moz-box-shadow: 0px 0px 10px #e8e3e0;
	}
	
	#flash {
		position: absolute;
		z-index: 30;
		top: 40px;
		left: 40px;
	}

/* GRID */
#container .grid {
	position: absolute;
	width: 100%;
	left: 0;
	top: 50px;
}

	.grid .thumb {
		position: absolute;
		width: 226px;
		height: 184px;
		top: 300px;
		left: 100px;
		cursor: pointer;
		visibility: hidden;
		user-select: none;
		-moz-user-select: none;
		-webkit-user-select: none;
	}
	
		.thumb .title {
			position: absolute;
			bottom: -4px;
			font-family: 'PTSansBold';
			font-size: 12px;
			color: #ff7c2d;
			text-transform: uppercase;
			border-top: 1px dotted #d0d0d0;
			width: 228px;
			padding-top: 4px;
			margin-top: 10px;
		}
	
		.thumb .mask {
			width: 226px;
			height: 160px;
			overflow: hidden;
			position: absolute;
			border: 1px solid #cfcecb;
		}
		
			.mask .new {
				position: absolute;
				right: 0;
				top: 0px;
				width: 52px;
				height: 52px;
				background-image: url('../images/grid/new.png');
				z-index: 3;
			}
			
			.mask .image {
				width: 226px;
				height: 160px;
				position: absolute;
			}
			
			.mask .label {
				position: absolute;
				bottom: 0;
				left: 0;
				width: 216px;
				height: 22px;
				background-color: #ff7c2d;
				font-family: 'Marvel';
				font-size: 16px;
				color: #f0f0f0;
				text-align: right;
				text-transform: uppercase;
				padding-top: 6px;
				padding-right: 10px;
			}
			
			.mask .loader {
				position: absolute;
				width: 432px;
				left: 50%;
				margin-left: -216px;
				height: 220px;
				background-color: #cfcecb;
				top: 0;
				z-index: 5;
			}
			
				.loader .gif {
					position: absolute;
					width: 28px;
					height: 20px;
					background-image: url('../images/grid/thumb-loader.gif');
					left: 50%;
					margin-left: -14px;
					top: 73px;
				}

	.grid .ticker {
		position: absolute;
		width: 594px;
		height: 184px;
		overflow: hidden;
		background-image: url('../images/common/ticker-bg.png');
		visibility: hidden;
	}
	
		.ticker .logo {
			position: absolute;
			width: 142px;
			height: 72px;
			background-image: url('../images/common/logo.png');
			right: 12px;
			top: 10px;
			cursor: pointer;
		}
		
		.ticker .counter_line {
			position: absolute;
			width: 450px;
			height: 2px;
			left: 131px;
			background-image: url('../images/common/ticker-split.png');
			top: 117.5px;
			z-index: 20;
		}
		
		.ticker .counter {
			position: absolute;
			width: 452px;
			height: 54px;
			background-image: url('../images/common/ticker-numbers-bg.png');
			right: 12px;
			top: 92px;
		}
		
			.counter .num_row {
				position: absolute;
				height: 48px;
				width: 12px;
				top: 3px;
				overflow: hidden;
			}
			
			.counter .num_holder {
				position: absolute;
				top: -17px;
				position: absolute;
				width: 12px;
				height: 393px;
				background-image: url('../images/common/ticker-numbers.png');
			}
		
		.ticker .counter_text {
			position: absolute;
			font-size: 25px;
			color: #fff;
			font-family: 'Ernest';
			right: 12px;
			top: 149px;
			text-transform: uppercase;
		}