@charset "utf-8";

/* =GLOBAL */
html{
	width: 100%;
	height: 100%
}

	@media only screen and (max-device-width: 480px){
		html{-webkit-text-size-adjust: none}
		a{-webkit-tap-highlight-color: rgba(200,0,0,0.4)}
	}
	
	/* Self-clearing floats */
	.clear:after, .cols:after{
		clear: both;
		content: ".";
		display: block;
		height: 0;
		visibility: hidden;
	}
	
	body{
		background: url(http://wpc.4D7D.edgecastcdn.net/004D7D/www/cyberpunk/landing/img/bg5.jpg) no-repeat 50% 0;
		background-color: #030710;
		color: #000;
		font: 62.5%/1.6 Arial, Helvetica, sans-serif;
		overflow: auto;
		position: relative;
		min-width: 970px;
		width: 100%;
	}
		
		body a{
			color: #d02f34;
			text-decoration: none;
		}
			
				body a:hover{
					text-decoration: none;
				}
			
			/* Only suitable for line-height: 1.6 */
			body a.ext{
				background: url(http://wpc.4D7D.edgecastcdn.net/004D7D/www/cyberpunk/landing/img/link.png) no-repeat 100% -3px;
				padding-right: 20px;
			}
			
		.cols > section, .cols > aside, .cols > .col{
			float: left;
			display: inline;
		}
			
			.triple > section, .triple > .col{
				width: 33.33%;
			}
			
	/* OVERLAY */
	#darken{
		position: fixed;
		left: 0;
		top: 0;
		right: 0;
		bottom: 0;
		background: rgba(0,0,0,.66);
		z-index: 99;
	}
	
		#overlay{
			width: 759px;
			height: 520px;
			background: url(http://wpc.4D7D.edgecastcdn.net/004D7D/www/cyberpunk/landing/img/overlay-03.jpg) no-repeat;
			position: absolute;
			top: 130px;
			left: 50%;
			margin-left: -380px;
			z-index: 100;
		}
			
			#overlay .close{
				display: block;
				overflow: hidden;
				text-indent: -9999px;
				background: url(http://wpc.4D7D.edgecastcdn.net/004D7D/www/cyberpunk/landing/img/close.png) no-repeat 50% 50%;
				height: 33px;
				width: 33px;
				position: absolute;
				top: 15px;
				right: 20px;
			}
			
			#overlay .browse{
				display: block;
				overflow: hidden;
				text-indent: -9999px;
				background-image: url(http://wpc.4D7D.edgecastcdn.net/004D7D/www/cyberpunk/landing/img/browse.png);
				background-position: no-repeat;
				height: 33px;
				width: 33px;
				position: absolute;
			}
			
				#overlay .prev{
					background-position: 0 50%;
				}
				
					#movies .prev{
						top: 65px;
						left: 25px;
					}
					
					#wallpapers .prev{
						top: 65px;
						left: 55px;
					}
					
					#buttons .prev{
						top: 43px;
						left: 75px;
					}
			
				#overlay .next{
					background-position: 100% 50%;
				}
				
					#movies .next{
						top: 65px;
						right: 12px;
					}
					
					#wallpapers .next{
						top: 65px;
						right: 50px;
					}
					
					#buttons .next{
						top: 43px;
						right: 75px;
					}
			
			#overlay h2{
				display: block;
				overflow: hidden;
				text-indent: -9999px;
				background: url(http://wpc.4D7D.edgecastcdn.net/004D7D/www/cyberpunk/landing/img/media-h2.png) no-repeat 50% 50%;
				height: 35px;
				margin: 25px 0 10px;
			}
		
			#overlay h3{
				display: block;
				overflow: hidden;
				text-indent: -9999px;
				background-image: url(http://wpc.4D7D.edgecastcdn.net/004D7D/www/cyberpunk/landing/img/overlay-h3.png);
				background-repeat: no-repeat;
				height: 19px;
				margin: 25px 0 10px;
			}
			
				.movies h3{
					background-position: 50% 0;
				}
				
				.wallpapers h3{
					background-position: 50% 50%;
				}
				
				.buttons h3{
					background-position: 50% 100%;
				}
				
			.section{
				position: relative;
			}
		
			.medias{
				overflow: hidden;
			}
			
					.movies .medias{
						width: 670px;
						margin: 0 auto;
					}
					
					.wallpapers .medias{
						width: 567px;
						margin: 0 auto;
					}
					
					.buttons .medias{
						width: 519px;
						margin: 0 auto;
					}
			
				.medias li{
					float: left;
					display: inline;
				}
				
					.medias .mbox{
						float: left;
						display: inline;
						margin: 0 5px;
					}

#teaser{
    width: 860px;
    height: 610px;
    background: url(http://wpc.4D7D.edgecastcdn.net/004D7D/www/cyberpunk/landing/img/teaser-bg-03.jpg) no-repeat;
    position: absolute;
    top: 130px;
    left: 50%;
    margin-left: -450px;
    z-index: 100;
	padding: 0 20px;
}

#teaser .close{
    display: block;
    overflow: hidden;
    text-indent: -9999px;
    background: url(http://wpc.4D7D.edgecastcdn.net/004D7D/www/cyberpunk/landing/img/close.png) no-repeat 50% 50%;
    height: 33px;
    width: 33px;
    position: absolute;
    top: 15px;
    right: 20px;
}
#teaser h2{
    display: block;
    overflow: hidden;
    text-indent: -9999px;
    background: url(http://wpc.4D7D.edgecastcdn.net/004D7D/www/cyberpunk/landing/img/media-h2.png) no-repeat 50% 50%;
    height: 35px;
    margin: 25px 0 10px;
}
#teaser iframe {
    margin-left: 23px /* 900-853/2 */
}

	/* =WRAP */


	#wrap{
		height: 1600px;
		width: 970px;
		display: block;
		position: relative;
		margin: 0 auto;
		font-size: 16px;
		font-family: "Droid Sans", Tahoma, sans-serif;
	}
	
	#reg {
		height: 1350px;
		width: 864px;
		display: block;
		float: left;
		font-size: 1.6em;
		font-family: "Droid Sans", Tahoma, sans-serif;
		margin-top: 100px;
		margin-left: 60px;
		background-image: url(http://wpc.4D7D.edgecastcdn.net/004D7D/www/cyberpunk/landing/img/bg-reg-wrapper.jpg);
	}

	#reg p {
		font-size: 11px;
		line-height: 15px;
		font-family: "Droid Sans", Tahoma, sans-serif;
		z-index: 1;
		color: #758782;
		width: 740px;
		display: block;
		float: left;
		margin-left: 60px;
		margin-top: 20px;
} 			

	#reg p strong {
		font-weight: bold;
		font-size: 14px;
} 			
	
		#from{
			height: 75px;
			overflow: hidden;
			text-indent: -9999px;
		}
	
		#logo{
			height: 300px;
			margin: 4px 0;
		}
	
		#social{
			height: 80px;
			text-align: center;
			position: relative;
			background: transparent;
			z-index: 3;
		}
		
			#social li{
				display: inline-block;
				width: 45px;
				height: 45px;
				position: relative;
				margin: 0 9px;
				z-index: 10;
			}
			
				#social li a{
					display: inline-block;
					overflow: hidden;
					height: 45px;
					width: 45px;
					text-indent: -9999px;
				}

				#social li a:hover {
					background-image: url(http://wpc.4D7D.edgecastcdn.net/004D7D/www/cyberpunk/landing/img/social-hover.png);
					background-repeat: no-repeat;
				}

				
				#social li .tooltip{
					display: none;
					border: 3px solid #ff0;
					background: #fff;
					padding: 5px;
					position: absolute;
					left: 50%;
					margin-left: -83px;
					width: auto;
					bottom: 52px;
					text-align: center;
				}
				
						#social .twitter-wrap{
							width: 100px;
						}
					
					#social li .tooltip:after{
						content: '';
						border-top: 10px solid #ff0;
						border-left: 10px solid transparent;
						border-right: 10px solid transparent;
						position: absolute;
						bottom: -10px;
						left: 50%;
						margin-left: -10px;
						z-index: 0;
					}
					
					#social li .tooltip:before{
						content: '';
						border-top: 7px solid #fff;
						border-left: 7px solid transparent;
						border-right: 7px solid transparent;
						position: absolute;
						bottom: -7px;
						left: 50%;
						margin-left: -7px;
						z-index: 1;
					}
	
		#neon{
			list-style: none;
			overflow: hidden;
			width: 970px;
			margin: 0;
			display: block;
			z-index: 2;
		}
		
			#neon li{
				float: left;
				display: inline;
				height: 280px;
				position: relative;
				line-height: 1.35;
				z-index: 0;
			}
			
					.neon .active, .neon .hover{
						height: 300px;
						width: 420px;
						position: absolute;
						background-image: url(http://wpc.4D7D.edgecastcdn.net/004D7D/www/cyberpunk/landing/img/neon-boxes01.png);
						background-repeat: no-repeat;
						top: 0;
						left: 0;
						z-index: 0;
					}
					
						#neon .active{
							display: none;
						}
					
						.neon .hover{
							display: none;
							color: #000;
						}
						
							.neon .hover .txt{
								position: absolute;
								top: 65px;
								overflow: hidden;
								height: 154px;
								color: #fff;
							}
						
					.neon h2 {
						margin-bottom: 10px;
						font-weight: bold;
						font-size: 22px;
						line-height: 1.15;
						color: #fff;
					}
						
					.neon a{
						height: 260px;
						width: 400px;
						background: url(http://wpc.4D7D.edgecastcdn.net/004D7D/www/cyberpunk/landing/img/) repeat;
						position: absolute;
						overflow: hidden;
						text-indent: -9999px;
						display: block;
						top: 0;
						left: 0;
						z-index: 10;
					}
			
.neon h2.h-blue {
	color: #03deea;
}

.neon h2.h-orange {
	color: #f5e014;
}
			
				#blue{
					width: 370px;
					margin-left: 0;
				}
				
					#blue div.active{
						background: none;
						display: block;
						color: #d9e3e4;
						text-shadow: #000 1px 1px 1px;
						text-align: center;
						margin: 0;
					}
					
					
						#blue .active .txt{
							position: absolute;
							width: 200px;
							top: 115px;
							left: 34px;
							color: #fff;
						}
					
					#blue .hover{
						background-position: -37px -457px;
					}
					
						#blue .hover .txt{
							width: 200px;
							left: 32px;
							text-align: center;
						}
					
				#video{
					width: 410px;
					margin: 0 0 0 -87px;
				}
				
					#video .active{
						background-position: -631px 0;
					}
					
					#video .hover{
						background-position: -691px -457px;
					}
					
						#video .hover .txt{
							width: 260px;
							left: 103px;
						}
					
				#orange{
					width: 275px;
				}
				
					#orange .active{
						background-position: 100% 0;
					}
					
					#orange .hover{
						background-position: -1470px -457px;
					}
					
						#orange .hover .txt{
							width: 145px;
							left: 95px;
						}
						
		#likebox{
			width: 960px;
			margin: 0 auto;
			margin-top: 50px;
		}
	
			#likebox .right{
				float: right;
				display: inline;
				width: 471px;
			}
			
				.fb-like-box ::-webkit-scrollbar{
					width: 8px;
					height: 8px;
					background: rgba(0,0,0,.15);
				}
				
				.fb-like-box ::-webkit-scrollbar-thumb{
					background-color: rgba(0,0,0,.45);
					-webkit-box-shadow: inset 1px 1px 0 rgba(0,0,0,.10), inset 0 -1px 0 rgba(0,0,0,.07);
				}
			
		#footer{
			width: 960px;
			position: absolute;
			bottom: 90px;
			left: 50%;
			margin-left: -480px;
			z-index: 4;
		}
		
			#footline{
				list-style: none;
				width: 960px;
				overflow: hidden;
			}
		
			#footer li{
				float: left;
				display: inline;
				line-height: 43px;
				margin-right: 26px;
			}
			
				#footer .cdpr a{
					height: 62px;
					width: 167px;
					background: url(http://static.cdprojektred.com/cyberpunk/gfx/2014-05-14_CDPR-Logo-White-CyberpunkWWW.png) no-repeat;
					display: block;
					overflow: hidden;
					text-indent: -9999px;
				}
				
				#footer .rgames a{
					height: 46px;
					width: 71px;
					background: url(http://wpc.4D7D.edgecastcdn.net/004D7D/www/cyberpunk/landing/img/rgames.png) no-repeat;
					display: block;
					overflow: hidden;
					text-indent: -9999px;
				}
				
				#footer a{
					color: #f32630;
					font-size: 12px;

					
				}
				
				#footer a:hover {
					text-decoration: underline;;
				}
				
				.mbox a:hover {
	text-decoration: underline;
}
				
				#footer .right{
					margin: 0;
					float: right;
				}
				
				.wallpaper-link {
					margin-left: 70px;
					color: #fff210;
}
	
		#guy{
			width: 895px;
			display: none;
			height: 765px;
			background: url(http://wpc.4D7D.edgecastcdn.net/004D7D/www/cyberpunk/landing/img/guy2.png) no-repeat;
			overflow: hidden;
			text-indent: -9999px;
			position: absolute;
			bottom: 196px;
			left: -345px;
			display: block;
			z-index: 3;
		}
		
		
		#footer-reg {
			width: 960px;
			height: 90px;
			margin: 28px 0 0 0;
			padding: 0;
			display: block;
			float: left;
		}
		
					#footer-reg li{
				float: left;
				display: inline;
				line-height: 43px;
				margin-right: 26px;
			}
			
				#footer-reg .cdpr a{
					height: 46px;
					width: 167px;
					background: url(http://wpc.4D7D.edgecastcdn.net/004D7D/www/cyberpunk/landing/img/cdprojektred01.png) no-repeat;
					display: block;
					overflow: hidden;
					text-indent: -9999px;
				}
				
				#footer-reg .rgames a{
					height: 46px;
					width: 71px;
					background: url(http://wpc.4D7D.edgecastcdn.net/004D7D/www/cyberpunk/landing/img/rgames.png) no-repeat;
					display: block;
					overflow: hidden;
					text-indent: -9999px;
				}
				
				#footer-reg a{
					color: #f32630;
					font-size: 12px;

					
				}
				
				#footer-reg a:hover {
					text-decoration: underline;;
				}
				
				#footer-reg .right{
					margin: 0;
					float: right;
				}

/* COOKIE BAR */
#cookie-bar {position: fixed; z-index: 100; bottom: 0; width: 100%; height: 64px; background: url(../img/cookies_bg_cp.png) 50% 0 repeat-x; text-align: center; }
#cookie-bar * {color: #556a66; font: normal 13px/1.75em 'DroidSans', Arial, serif;}
#cookie-bar p {padding-top: 10px;}
#cookie-bar p a {border-bottom: 1px dotted;}
#cookie-close {color: #11c7dc; background: url(../img/close_cp.png) 0 0 no-repeat; padding-left: 28px; height: 23px; display: inline-block;}