"Serwmbi Ilmu Rakyat"
Bootstrap 3.3.0 Snippet by akmalkamaruddin

<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 ----------> <html> <body> <form method="post" action="$PORTAL_ACTION$"> <input name="redirurl" type="hidden" value="http://elibrary.bankrakyat.com.my/"> <input name="zone" type="hidden" value="captive"> <center> <table cellpadding="25%" cellspacing="0" width="380" height="300" style="border:2px dashed #000000"> <tr height="10" bgcolor="#FEFEFE"> <td style="border:1px dashed #000000"> <font color='black'> <b> <div class="row-fluid user-row" id="mainarea"> <p style="border:1px dashed"><img src="./malida.png.jpg" width="400" height="210" class="img-responsive" alt="Serambi Ilmu Rakyat"></p> </div> </b> </font> </td> </tr> <tr height="2" bgcolor="#fefefe"> <td <font style="border:1px dashed #000000"> <font color='Orange'size='+2'> <b> <center>Unifi Authentication Access</center> </b> </font> </td> </tr> <tr> <td> <div id="mainlevel"> <center> <table width="100%" border="1" cellpadding="5" cellspacing="0"> <tr> <td> <center> <div id="mainarea"> <center> <table width="100%" border="1" cellpadding="5" cellspacing="5"> <tr> <td> <div id="maindivarea"> <center> <div id='statusbox'> <font color='red' face='calibri' size='+1'> <b> <center>Invalid Authentication Access!</center> </b> </font> </div> </center> <br/> <div id='loginbox'> <table> <tr> <td colspan="2"> <h4><center>Please make sure that you have a valid access</td> </tr> <tr><td> </td></tr> </center></h4> <tr><td align="center-left">Username: </td><td><input name="auth_user" type="text" style="border: 1.7px dashed;" size="20"></td></tr> <tr><td align="center-left">Password: </td><td><input name="auth_pass" type="password" style="border: 1.7px dashed;" size="20"></td></tr> <tr><td> </td></tr> <tr> <td colspan="2"> <h4><center>or using voucher</td> </tr> <tr><td> </td></tr> </center></h4> <tr><td align="center-left">Enter Voucher Code: </td> <td><input name="auth_voucher" type="text" style="border:2px dashed;" size="20"></td> </tr> <tr> <td colspan="2"><center><input class="btn btn-lg btn-success btn-block" name="accept" type="submit" value="Continue"></input></center> </td> </tr> </table> </div> </center> </div> </td> </tr> </table> </center> </div> </center> </td> </tr> </table> </center> </div> </td> </tr> </table> </center> </form> </body> </html>
<link href="captiveportal-bootstrap.min.css" rel="stylesheet"> <style type="text/css"> body { background: url(backgroundoro.jpg); background-color: #444; background-size: 125%; }background: url(captiveportal-pinlayer2.png),url(captiveportal-pinlayer1.png),url(https://pbs.twimg.com/media/Bp59Ao0CYAAd2HW.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: #336b05; background-image: -webkit-linear-gradient(top, #336b05, #7b97a8); background-image: -moz-linear-gradient(top, #336b05, #7b97a8); background-image: -ms-linear-gradient(top, #336b05, #7b97a8); background-image: -o-linear-gradient(top, #336b05, #7b97a8); background-image: linear-gradient(to bottom, #336b05, #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 2px; 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; } </style>

Related: See More


Questions / Comments: