/* <<<<<<<< reset >>>>>>>> */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}


/* <<<<<<<< main >>>>>>>> */

body {
background-color: #f6f4f0;
font-family: 'Poppins', sans-serif;
-webkit-font-smoothing: antialiased;
font-size: 16px;
font-weight: 300;
margin: 0;
padding: 0;
color: #555555;
line-height: 160%;
}
.canvas {
width: 100%;
}

/* header */

.header-outer {
width: 100%;
background-color: #ffffff;
border-bottom: 2px solid #eaeaea;
}
.header-inner {
padding: 15px 40px;
box-sizing: border-box;
}
.header-left {
width: 160px;
float: left;
}
.header-left img {
width: 100%;
}
.header-right {
width: 370px;
float: right;
}
.header-right .left {
float: left;
width: 260px;
padding: 20px 0 0 0;
}
.header-right .right {
width: 100px;
float: right;
padding: 8px 0 0 0;
text-align: right;
}
.header-right .right a {
width: 100%;
font-size: 17px;
font-weight: 600;
text-decoration: none;
background-color: #f66430;
color: #ffffff;
display: block;
padding: 9px 0 4px 0;
text-align: center;
cursor: pointer;
-webkit-box-shadow: 0px 5px 0px 0px #c13a11;
-moz-box-shadow: 0px 5px 0px 0px #c13a11;
box-shadow: 0px 5px 0px 0px #c13a11;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
border: none;
}

/* login area */

.login-mid-outer {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #f6f4f0;
background-image: url("/images/Hero_CustomerLogIn_2019.jpg");
background-position: right 50%;
background-size: cover;
}
.login-mid-inner {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
.login-panel {
width: 500px;
position: absolute;
top: 0;
left: 0;
bottom: 0;
background-color: #FFFFFF;
padding: 100px 40px;
box-sizing: border-box;
z-index: 20;
}
.login-panel .lp-section{
margin: 0 auto 30px 0;
}
.login-panel img {
display: block;
margin: 0 auto 40px auto;
}
.login-panel h1 {
display: block;
margin: 0 0 20px 0;
font-size: 24px;
letter-spacing: -1px;
font-weight: 600;
text-align: center;
}
.login-panel h2 {
display: block;
margin: 0 0 20px 0;
font-size: 24px;
letter-spacing: -1px;
font-weight: 600;
text-align: center;
}
.login-panel .desc {
margin: 0 0 5px 0;
}
.login-panel .field {
margin: 0 0 20px 0;
}
.login-panel input[type=text],
.login-panel input[type=email],
.login-panel input[type=password] {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background-color: #FFFFFF;
width: 100%;
box-sizing: border-box;
margin: 0;
border: 1px solid #cccccc;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
padding: 10px 15px;
font-size: 16px;
-webkit-box-shadow:inset 0 0 10px #eaeaea;
-moz-box-shadow:inset 0 0 10px #eaeaea;
box-shadow:inset 0 0 10px #eaeaea;
color: #222222;
font-weight: 300;
}
.login-panel-error-input {
}
.login-panel-error-desc {
}
.login-panel-help-block {
display: block;
background-color: #ff9966;
border: 1px solid #f66430;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
color: #ffffff;
font-weight: 600;
font-size: 14px;
line-height: 140%;
padding: 10px 15px 8px 15px;
margin: 0 0 10px 0;
text-align: center;
}
.login-panel-alert-box {
font-size: 28px;
margin: 0 0 20px 0;
}
.login-panel input[type=submit] {
font-size: 19px;
font-weight: 600;
text-decoration: none;
background-color: #f66430;
color: #ffffff;
display: block;
width: 100%;
padding: 10px 0 7px 0;
text-align: center;
cursor: pointer;
-webkit-box-shadow: 0px 5px 0px 0px #c13a11;
-moz-box-shadow: 0px 5px 0px 0px c13a11;
box-shadow: 0px 5px 0px 0px #c13a11;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
border: none;
}
.login-panel .sml-text {
font-size: 13px;
line-height: 140%;
padding: 40px 0 0 0;
}

/* general */

p {
margin: 0 0 20px 0;
}
.remove-p p {
margin: 0;
}
b, strong {
font-weight: 600;
}
.clearfix {
clear: both;
}
::-webkit-input-placeholder {
color: #cccccc;
}
:-moz-placeholder {
color: #cccccc;
}
::-moz-placeholder {
color: #cccccc;
}
:-ms-input-placeholder {  
color: #cccccc;
}
::selection {
background: #f66430;
color: #ffffff;
}
::-moz-selection {
background: #f66430;
color: #ffffff;
}
a:link,
a:visited,
a:active,
a:hover {
color: #f66430;
}