<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>
<!------ Include the above in your HEAD tag ---------->
</head><div class="container">
<meta charset="utf-8">
<title>Unifi Authentication</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="http://netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">
<div class="row" >
<tr><td align="center"><h2>Welcome to the Unifi Portal Access!</h2></td></tr>
</div>
</div>
</head>
<div class="container">
<div class="row vertical-offset-100">
<div class="col-md-6 col-md-offset-3">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Network Access Agreements</h3>
</div>
<div class="panel-body">
<form method="post" action="$PORTAL_ACTION$" accept-charset="UTF-8" role="form">
<fieldset>
<!-- Required input boxes for portal page to work. Only required if user authentication is needed. -->
<p>You are responsible for the security and appropriate use of Internet Access (hereby Wifi) network resources under your control. Using Akmal's resources for the following is strictly prohibited:</p>
<ul>
<li>Causing a security breach to either Wifi or other network resources, including, but not limited to, accessing data, servers, or accounts to which you are not authorized; circumventing user authentication on any device; or sniffing network traffic. </li>
<li>Causing a disruption of service to either Wifi or other network resources, including, but not limited to, ICMP floods, packet spoofing, denial of service, heap or buffer overflows, and forged routing information for malicious purposes.</li>
<li>Introducing honeypots, honeynets, or similar technology on Wifi's network.</li>
<li>Violating copyright law, including, but not limited to, illegally duplicating or transmitting copyrighted pictures, music, video, and software. </li>
<li>Exporting or importing software, technical information, encryption software, or technology in violation of international or regional export control laws.</li>
<li>Use of the Internet or Wifi's network that violates local laws.</li>
<li>Intentionally introducing malicious code, including, but not limited to, viruses, worms, Trojan horses, e-mail bombs, spyware, adware, and keyloggers. </li>
<li>Port scanning or security scanning on a production network unless authorized in advance by Information Security.</li>
</ul>
<div class="form-group">
<input name="auth_user" type="text" placeholder="Super secret word?" class="form-control">
</div>
<input name="auth_pass" type="text" class="hidden" value="password">
<input name="redirurl" type="hidden" value="captiveportal-success.html">
<input class="btn btn-lg btn-success btn-block" name="accept" type="submit" value="I Agree">
</fieldset>
</form>
</div>
</div>
</div>
</div>
</div
body {
background: url((https://pbs.twimg.com/media/Bp59Ao0CYAAd2HW.jpg);
background-color: #444;
background-repeat: no-repeat;
background-size: 125%;
background: url(captiveportal-pinlayer2.png),url(captiveportal-pinlayer1.png),url(backgroundoro.jpg);
}
.vertical-offset-100 {
padding-top:100px;
}
.form-signin input[type="text"] {
margin-bottom: 5px;
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
}
.form-signin input[type="password"] {
margin-bottom: 8px;
border-top-left-radius: 0;
border-top-right-radius: 0;
}
.form-signin .form-control {
position: relative;
font-size: 14px;
font-family: 'Open Sans', Arial, Helvetica, sans-serif;
height: auto;
padding: 8px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.vertical-offset-100 {
padding-top: 100px;
}
.img-responsive {
display: block;
max-width: 100%;
height: auto;
margin: auto;
}
.panel {
margin-bottom: 20px;
background-color: rgba(255, 255, 255, 0.75);
border: 1px solid transparent;
border-radius: 4px;
-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
}
.btn {
background: #000000;
background-image: -webkit-linear-gradient(top, #000000, #7b97a8);
background-image: -moz-linear-gradient(top, #000000, #7b97a8);
background-image: -ms-linear-gradient(top, #000000, #7b97a8);
background-image: -o-linear-gradient(top, #000000, #7b97a8);
background-image: linear-gradient(to bottom, #000000, #7b97a8);
-webkit-border-radius: 8;
-moz-border-radius: 8;
border-radius: 8px;
-webkit-box-shadow: 0px 1px 3px #666666;
-moz-box-shadow: 0px 1px 3px #666666;
box-shadow: 0px 1px 3px #666666;
font-family: Georgia;
color: #ff8c00;
font-size: 14px;
padding: 12px 20px 10px 20px;
border: solid #ffa200 8px;
text-decoration: none;
}
.btn:hover {
background: #336b05;
background-image: -webkit-linear-gradient(top, #336b05, #59eb11);
background-image: -moz-linear-gradient(top, #336b05, #59eb11);
background-image: -ms-linear-gradient(top, #336b05, #59eb11);
background-image: -o-linear-gradient(top, #336b05, #59eb11);
background-image: linear-gradient(to bottom, #336b05, #59eb11);
text-decoration: none;
}
$(document).ready(function(){
$(document).mousemove(function(e){
TweenLite.to($('body'),
.5,
{ css:
{
backgroundPosition: ""+ parseInt(event.pageX/8) + "px "+parseInt(event.pageY/'12')+"px, "+parseInt(event.pageX/'15')+"px "+parseInt(event.pageY/'15')+"px, "+parseInt(event.pageX/'30')+"px "+parseInt(event.pageY/'30')+"px"
}
});
});
})
