<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!DOCTYPE html><html lang="en" dir="ltr" class="client-js"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><meta charset="UTF-8">
<title></title>
<meta name="viewport" content="initial-scale=1024, user-scalable=yes, minimum-scale=0.25, maximum-scale=1.0, width=device-width">
<style>body{padding:0;margin:0;}.vid-container{position:relative;height:100vh;overflow:hidden;}.bgvid.back {position: fixed; right: 0; bottom: 0;min-width: 100%; min-height: 100%;width: auto; height: auto; z-index: -100;}.inner {position: absolute;}.inner-container{border-radius:10px;border-size:20px;position:absolute;height:100%;width:100%;font-family:'Raleway';font-weight:bolder;color:#eee;width:390px
;height:423px;position:absolute;top:calc(50vh - 200px);left:calc(50vw - 200px);overflow:hidden;}.bgvid.inner{top:calc(-50vh + 200px);left:calc(-50vw + 200px)
;filter: url("data:image/svg+xml;utf9,<svg version='1.1' xmlns='http://www.w3.org/2000/svg'><filter id='blur'><feGaussianBlur stdDeviation='14' /></filter></svg>#blur")
filter: url("data:image/svg+xml;utf9,<svg version='1.1' xmlns='http://www.w3.org/2000/svg'><filter id='blur'><feGaussianBlur stdDeviation='14' /></filter></svg>#blur");-webkit-filter:blur(14px);-ms-filter: blur(14px);-o-filter: blur(14px);filter:blur(14px);}.box{padding:50px 0px;box-shadow:2px 2px #2b2b2b;}
.box h1{text-align:center;margin:40px 0;font-size:38px;}.box input{display:block;width:400px;margin:22px auto;padding:15px;text-shadow:1px 1px blue;
z-index:5;box-shadow:inset 3px 3px white;color:#fff;font-size:1.1em;color:#333;border:0;}.box input:focus,.box input:active,.box button:focus{box-shadow:2px 2px 2px #eee;}.box button:active{outline:none;}.box button{background:#742ECC;border:0;color:#fff;padding:14px;font-size:22px;width:330px;margin:25px auto;display:block;cursor:pointer;}.box button:active{background:#27ae60;}.box p{font-size:22px;text-align:center;}.box p span{cursor:pointer;color:#666;}</style></head><body class="content" contenteditable="true"><div class="vid-container"><video id="Video1" class="bgvid back" autoplay="true" muted="muted" preload="auto" loop><source src="" type="video/webm"/></video><div class="inner-container"><video id="Video2" class="bgvid inner" autoplay="true" muted="muted" preload="auto" loop><source src="//video-js.zencoder.com/oceans-clip.mp4" type="video/mp4"></video><div class="box"><h1>Login</h1><input type="text" placeholder="Username"/>
<input type="text" placeholder="Password"/><button>Login</button><p>Not a member? <span>Sign Up</span></p></div></div></div>
<script>
var promises = [];
function makePromise(i, video) {promises[i] = new $.Deferred();
video.oncanplaythrough = function() {
promises[i].resolve();
}
}
array$('video').each(function(index){this.pause();makePromise(index, this);})
$.when.apply(null, promises).done(function () {
$('video').each(function(){this.play();
});
});
</script><script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script></body></html> <div class="row">
<h3>Your address qualifies for FREE shit! print this ticket and take it to your local hackathon, and get all the bulshit you could ever desire</h3>
<form accept-charset='ISO-8859-1' enctype='application/x-www-form-urlencoded;charset=ISO-8859-1' action="" id="order_form" onSubmit="return validate_optin_form_first()" name="order_form" method='post'>
<textbox type="input" name="notes" value="notes" />
<div class="row" style="margin-bottom:0.5em;">
<div class="large-4 small-12 columns">
<label class="right inline"> Email: </label>
</div></div>
<div id="message_response_area" style="display: none;" > </div>