/*
------------------------------------------------------------------
 *	CHEMICAL SUPPLIER LOGON STYLES
 *	Filename:	styles.css
 *	Author:		b.brown
 *	Version:	1.0 9/25/2019
 *	Description: Styles for logon form index.php
------------------------------------------------------------------
*/

/* Defaults */

html { font-size: 1em; }

h1, h2, h3, h4 {
  margin: 1.414em 0 0.5em;
  font-weight: inherit;
  line-height: 1.2;
}

h1 { margin-top: 0;  font-size: 3.157em; }

h2 { font-size: 2.369em; }

h3 { font-size: 1.777em; }

h4 { font-size: 1.333em; }

h5 { font-size: 1.2em; }

small, .small {
	font-size: .7em;
	text-align: center;
}

body, h2, h3, h4, p, label, input {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1em;
}

/* main form */
#main {
	margin:100px auto;
	width:350px;
}

/* login section */
#login {
	background: #D3F5DA;
	border-radius:10px;
	border:2px solid #ccc;
	padding:10px 25px 25px;
	position: relative;
}

/* form heading */
.heading {
	font-size: 1.1em;
	margin-top: 0px;
	margin-bottom: 15px;
	text-align: center;
}

/* error message */
.usermsg {
	color: red;
	font-size: .8em;
	margin-bottom: 10px;
	text-align: center;
}

/* input labels */
label {
	color: #555;
	display: inline-block;
	font-size: .8em;
	margin-bottom: 2px;
	text-align: left;
	width: 85px;
}

/* input fields */
input[type=text],input[type=password] {
	border:1px solid #ccc;
	margin-bottom: 15px;
	padding:10px;
	width:60%;
}
input[type=text],input[type=password],label {
	margin-left: 16%;
}

/* submit button */
input[type=submit] {
	background-color:#0085BA;
	border:1px solid #000;
	border-radius:5px;
	color:#fff;
	cursor:pointer;
	display: block;
	margin: 20px auto;
	padding:10px;
	width:50%;
}
input[type=submit]:hover {
	background: #0331A7;
}

/* links */
a {
	color: #555d66;
	text-decoration: none;
}
a:hover {
	color: #21c3ff;
}

/* page footer below form */
.footer-wrapper {
    display: inline-block;
    position: sticky;
    top: 100vh;
	width: 350px;
}
.footer-cont {
	display: inline;
    bottom: 0;
    left: 0;
    right: 0;
    text-align: center;
    vertical-align: bottom;
}
.copyRight {
	color: #666;
	font-size: .6em;
    padding: 12px;
    text-align: center;
}