Kore Web UI

by salitrapraveen

HTML

<h1>Aqua Pharmacy Store</h1>

<div id="content">
   <div id="login">
       <h2>Login</h2>
       <form action="Login" method="post">
       <label for="username">Username<label/>
           <input type="text" name="username" id="username"/>

       <label for="password">Password<label/>
           <input type="password" name="password" id="password" />
           <br/>
           <input type="submit" name="submit_login" id="submit_login" value="Sign In"/>           
           <br/><br/>
           <a href="#">Forgot Password?</a>
           <br/><br/>
    </div>
           
</div>

CSS

body {
    margin: 0px;
    padding: 0px;
    font-size: 14px;
    font-family: Arial,Helvetica,sans-serif;
    }

h1 {
    color: #fff;
    font-weight: bold;
    font-size: 18px;
    margin: 0px 0 10px 0;
    padding: 8px;
    background-color: #3A5157;
    position: relative;    
    box-shadow: 0px 4px 4px #587C85;
    overflow: hidden;
}

#content {
    position: absolute;
    padding: 0px;
    top: 46px;
    bottom: 20px;
    left: 20px;
    right: 20px;
    border: 2px solid #466773;
    box-shadow: 4px 4px 4px #87A1AD;
    border-radius: 4px;    
    overflow: auto;
}

#login {
 width: 280px;  
 left: 25%;
 top: 25%;   
 padding: 0px 14px 10px 14px;
 border: 1px solid #CFCFCF;    
 position: absolute;
}

input[type="text"], input[type="password"] {
 margin: 4px 2px 8px 2px;
 line-height: 25px;
 width: 270px;   
 font-size: 16px;   
}

input[type="submit"] {
    left: 110px;
    padding: 6px;
    height: 28px;
    position: relative;
    margin-bottom: 10px;
}


h2{
    text-align: center;
    color: white;
    font-weight: bold;
    background-color: #3A5157;
    position: relative;
    border-top-left-radius: 8px;
    -moz-border-top-left-radius: 8px;
    -webkit-border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    -moz-border-top-right-radius: 8px;
    -webkit-border-top-right-radius: 8px;
    box-shadow: 0px 2px 4px #587C85;
    -moz-box-shadow: 0px 2px 4px #587C85;
    -webkit-box-shadow: 0px 2px 4px #587C85;
    margin: -4px -18px 20px -18px;
    padding: 8px;
}