<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
<title>Insert title here</title>
<style>
.divider:after, .divider:before {
	content: "";
	flex: 1;
	height: 1px;
	background: #eee;
}

h1 {
	position: relative;
	top: 30px;
}

body {
	overflow: hidden;
}
</style>
</head>
<body>
<h1 align = "center">Customer Login</h1>
	<section class="vh-100">
  <div class="container py-5 h-100">
    <div class="row d-flex align-items-center justify-content-center h-100">
      <div class="col-md-8 col-lg-7 col-xl-6">
        <img src="https://img.freepik.com/premium-vector/bank-money-thin-icon-collection_1151483-62576.jpg?size=626&amp;ext=jpg&amp;ga=GA1.1.1971909417.1722793102&amp;semt=ais_hybrid&quot"
          class="img-fluid" alt="Phone image">
      </div>
      
      
      <div class="col-md-7 col-lg-5 col-xl-5 offset-xl-1">
      
        <form id="cForm" action="customerLoginReq" method="get">
          <!-- Email input -->
          <div data-mdb-input-init class="form-outline mb-4">
            <input type="text" name = "cid" id="form1Example13" class="form-control form-control-lg" />
            <label class="form-label" for="form1Example13">Customer ID</label>
          </div>

          <!-- Password input -->
          <div data-mdb-input-init class="form-outline mb-4">
            <input type="password" name = "cpwd" id="form1Example23" class="form-control form-control-lg" />
            <label class="form-label" for="form1Example23">Password</label>
          </div>

          <div class="d-flex justify-content-around align-items-center mb-4">
            <!-- Checkbox -->
            <div class="form-check">
              <input class="form-check-input" type="checkbox" value="" id="form1Example3" checked />
              <label class="form-check-label" for="form1Example3"> Remember me </label>
            </div>
            
          </div>

          <!-- Submit button -->
          <input type="submit" name="customer_login_btn" value="LOGIN" data-mdb-button-init data-mdb-ripple-init class="btn btn-primary btn-lg btn-block">

        </form>
      </div>
    </div>
  </div>
</section>
</body>
</html>