Nomad Card JS + CSS

							<link href="https://fonts.googleapis.com/css?family=Rubik:500" rel="stylesheet">
							<script>
								$(function() {
									$('.nomadcard').bind('mousemove',function(e) {
										console.log('mousemove');
										pOffset = $(this).offset(); 
										x = e.pageX - pOffset.left;
										y = e.pageY - pOffset.top;
										w=$(this).width();
										h=$(this).height();
										propX=(x/w);
										propY=(y/h);
										$('.nomadcard .bg').css('background',
											'linear-gradient(to bottom left,rgba(255, 255, 255, 0.05),rgba(255, 255, 255, 0.2) ' + (propX*75-3) + '%,rgba(255, 255, 255, 0.125) ' + (propX*100-3) + '%,rgba(255, 255, 255, 0.1) ' + (propX*100) + '%,rgba(0, 0, 0, 0.05))'
										);

										$('.nomadcard').css('transform',(
											 'perspective(500px) '
											+'rotateX('
												+(15*(propY-0.5))+'deg'
											+')'
											+'rotateY('
												+(15*(propX-0.5))+'deg'
											+')'
											+'translate3d('
												+(5*(propY-0.5))+'px,'
												+(5*(propX-0.5))+'px,'
												+'0px'+
											') '
											)
										);
										$('.nomadcard .inside').css('transform',(
											 'perspective(1000px) '
											+'rotateX('
												+(6*(propY-0.5))+'deg'
											+')'
											+'rotateY('
												+(6*(propX-0.5))+'deg'
											+')'
											+'translate3d('
												+(2*(propY-0.5))+'px,'
												+(2*(propX-0.5))+'px,'
												+'100px'+
											') '
											)
										);
										$('.nomadcard .inside').css('transform',(
											 'perspective(750px) '
											+'rotateX('
												+(6*(propY-0.5))+'deg'
											+')'
											+'rotateY('
												+(6*(propX-0.5))+'deg'
											+')'
											+'translate3d('
												+(2*(propY-0.5))+'px,'
												+(2*(propX-0.5))+'px,'
												+'25px'+
											') '
											)
										);
									})
								});
							</script>
							<div class="nomadcard">
								<div class="bg"></div>
								<div class="inside">
									<div class="headline">
										Nomad Card
										<span class="trademark">
											&trade;
										</span>
										<span class="by-nomadlist">
											by Nomad List
										</span>
									</div>
									<div class="number">
										4000 1234 5678 9010
									</div>
									<div class="expiry">
										<div class="goodthru">
											exp
											date
										</div>
										<div class="date">
											07/22
										</div>
									</div>

									<div class="name">
										S. Reustle
									</div>
									<div class="logo"></div>
								</div>
							</div>