@charset "utf-8";
/* CSS Document */
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, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; outline: 0; vertical-align: baseline; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
ol, ul { list-style: none; }
table { border-collapse: collapse; border-spacing: 0; }
a, a:hover, a:focus { text-decoration: none; }
* {box-sizing: border-box;}
figure { margin: 0; padding: 0 }
input,button {outline: none;}
html { font-family: 'Lato', sans-serif; font-size: 62.5%; line-height: 1.2; font-weight: 400; color: #000; }
.img-responsive { max-width: 100%; height: auto; display: block; }
.clearfix:after { content: ''; display: block; clear: both; }
.wrapper {max-width: 1920px; margin: 0 auto;}
header { background: #a50c13; text-align: right; height: 129px;}
header figure { float: left; max-width: 50%; }
header .logo { display: inline-block; margin: 1.5rem 1.5rem 0 0; max-width: 35%; }
nav { background: #d6d6d6; padding: 0.4rem 1.5rem;}
nav ul li {display: inline-block; vertical-align: middle; padding: 0 0.3rem;  color: #000;}
nav ul li, nav ul li a {font-size: 1.3rem; line-height: 2.5;}
nav ul li a, nav ul li.divider {color: #a50c13;}
nav ul li a:hover {color: #da2424;}
.content-wrapper {display: table; table-layout: fixed; width: 100%;}
.content-wrapper > div {display: table-cell; vertical-align: top; max-width: 50%;}
.loginWindow {margin:50px 0 0 80px; width: 100%; max-width: 350px;}
.loginWindow li {display: block; margin-bottom: 3rem; position: relative; font-size: 1.3rem;}
.loginWindow li h2 {font-size: 3rem; font-weight: 400; border-bottom: 2px solid #263f52; display: inline-block; padding: 0 0 0.5rem;}
.text-field {background-color: transparent; border-width: 0 0 1px 0; border-color: rgba(0,0,0,0.40); padding: 0.8rem 0; font-size: 1.4rem; width: 100%; height: 34px;}
.loginWindow li .lbl, .loginWindow li .line {position: absolute; left: 0; transition: all 0.3s ease-in-out;}
.loginWindow li .lbl {top: 1rem; font-size: 1.4rem; pointer-events: none;}
.loginWindow li .lbl.up {top: -1rem; font-size: 1.2rem;}
.loginWindow li .line {width: 100%; height: 2px; background: #263f52; bottom: 0; transform: scale(0);}
.loginWindow li.error .line {background: #da2424; transform: scale(1);}
.loginWindow li .text-field:focus ~ .line {transform: scale(1);}
.loginWindow li p {position: absolute; width: 100%; left: 0; bottom: -15px; font-size: 1.2rem; color: #da2424; transform: scale(0); transition: all 0.3s ease-in-out; opacity: 0;}
.loginWindow li.error p {transform: scale(1); opacity: 1;}
.loginWindow li .button {margin-top: 1.3rem;}
.button {border: none; font-size: 1.6rem; line-height: 2.5; min-width: 12rem; padding: 0; text-align: center; cursor: pointer; transition: all 0.3s ease-in-out;}
.button.primary {color: #fff; background: #263f52;}
.button.primary:hover {background: #263f52;}
footer {background: #7a7a7a; padding: 1rem 1.5rem; color: #fff; font-size: 1.2rem; line-height: 1.6; height: 40px;}
footer p {display: inline-block;}
footer figure {float: right;}
footer figure figcaption {display: inline-block; vertical-align: top; margin-left: 5px;}
@media (max-width: 1024px) {
	.loginWindow {margin: 3rem 0 0 5rem; width: calc(100% - 8rem);}
}
@media (max-width: 768px) {
	.loginWindow {margin: 8rem 0 0 5rem}
	footer {text-align: center; height: 60px}
	footer p, footer figure {float: none; display: block;}	
}
