/* Reset CSS */
html, body, div, span, applet, object, iframe,
h1, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, 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 {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}

* {
	margin: 0;
}
html, body {
	height: 100%;
}

body {
	background: #DCDDDF url(../images/bg.png);
	color: #000;
	font: 14px Arial;
	font-size: 14px;
	margin: 0 auto;
	padding: 0;
	position: relative;
	margin: 0;
}

section:focus{
    outline: none;    
}​

h1{ font-size:28px;}
h3{ font-size:18px;}
h4{ font-size:16px;}
h5{ font-size:14px;}
h6{ font-size:12px;}
h1,h2,h3,h4,h5,h6{ color:#036;}
small{ font-size:10px;}
b, strong{ font-weight:bold;}
a, a:hover{ }


a{
	padding: 4px 6px;
	font-family: 'Abel', sans-serif;
}
a:hover, a:focus, a:active {
	background: #036;
	color: #eee !important;
	text-decoration: none;
	text-shadow: none;
	border: 1px dotted transparent;
}
a.hidden {
	position: absolute;
	left: -999px;
	overflow:hidden;			
}
a.hidden:focus, 
a.hidden:active { 
	left: 20px; 
}

.left { float:left; }
.right { float:right; }
.alignleft { float: left; margin-right: 15px; }
.alignright { float: right; margin-left: 15px; }
.clearfix:after,


form:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
fieldset{
	border: 0;
}

header#banner{
	padding: 0px;
	background-color: #005C8A;
	border-bottom: 1px solid #CCDEE8;
	border-top: 40px solid #002537;
}
header#banner div#bannerInfo{
	float: left;
	width: 100%;
	position:absolute;
	top: 10px;
	left: 5px;
}
header#banner div#bannerInfo a{
	color: #fff;
	text-decoration: none;
	border-width: 0;
	border-bottom: 1px solid transparent;
}
header#banner div#bannerInfo a:hover{
	color: #fff;
	background: #004061;
}
#navcontainer {
	font-size: 14px;
	background: #002537;
	padding: 4px 0;
}


#navlist{
	list-style: none;
	padding: 0;
	margin: 2px 0 2px 25px;
}
#navlist li{
	display: inline;
	padding: 0;
	margin: 0;
	color: #CCDEE8;
}
#navlist li:before { content: "\2022";margin: 0 10px 0 6px; }
#navlist li:first-child:before { content: ""; }

/*IE workaround*/
/*All IE browsers*/
* html #navlist li{
	border-left: 1px solid black;
	padding: 0 0.4em 0 0.4em;
	margin: 0 0.4em 0 -0.4em;
}

/*Win IE browsers - hide from Mac IE\*/
* html #navlist { height: 1%; }

* html #navlist li{
	display: block;
	float: left;
}
/*End hide*/
/*Mac IE 5*/
* html #navlist li:first-child { border-left: 0; }

#navlist li a{
	color: #CCDEE8 !important;
}
#navlist li a:hover, #navlist li a:focus, #navlist li a:active {
	color: #036 !important;
	background: #CCDEE8;
	text-shadow: none;
}

legend { display: none;}

.hide{ display: none;}

.container { 
	margin: 25px auto; 
	position: relative; 
	width: 900px;

	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin: 0 auto -4em;

	z-index: 1000; /* more than #footer */
}

h1, h1 a{
	font-family: 'Abel', sans-serif;
	color: #CCDEE8;
	margin: 0;
	text-align: center;
	font-size: 56px;
	font-weight: 300;
	padding: 6px 0;
	word-spacing:4px;
	letter-spacing:-2px;
	text-decoration: none;
}
h1 a:hover{
	background: none;
	text-decoration: underline;
}

 h2 {
	font-family: 'Abel', sans-serif;
	color: #036;
	margin: 0 0 10px 0;
	font-size: 22px;
	font-weight: 300;
	padding: 4px 0;
	letter-spacing:0px;
	width: 100%;
}
h2 a{
	color: #ccc !important;
	
}
h2 a:hover, h2 a:focus, h2 a:active {
	background: #036;
	color: #fff !important;
	text-decoration: none;
	text-shadow: none;
}


 h2#login {
	font-family: 'Lato', sans-serif;
	color: #036;
	margin: 44px 0 24px 0;
	text-align: center;
	font-size: 72px;
	font-weight: 300;
	padding: 0;
	text-transform: uppercase;
	word-spacing:14px;
	letter-spacing:-4px;
	background: none;
}


#content {
	background: #f9f9f9;
	background: -moz-linear-gradient(top,  rgba(248,248,248,1) 0%, rgba(249,249,249,1) 100%);
	background: -webkit-linear-gradient(top,  rgba(248,248,248,1) 0%,rgba(249,249,249,1) 100%);
	background: -o-linear-gradient(top,  rgba(248,248,248,1) 0%,rgba(249,249,249,1) 100%);
	background: -ms-linear-gradient(top,  rgba(248,248,248,1) 0%,rgba(249,249,249,1) 100%);
	background: linear-gradient(top,  rgba(248,248,248,1) 0%,rgba(249,249,249,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f8f8f8', endColorstr='#f9f9f9',GradientType=0 );
	-webkit-box-shadow: 0 1px 0 #fff inset;
	-moz-box-shadow: 0 1px 0 #fff inset;
	-ms-box-shadow: 0 1px 0 #fff inset;
	-o-box-shadow: 0 1px 0 #fff inset;
	box-shadow: 0 1px 0 #fff inset;
	border: 1px solid #c4c6ca;
	margin: 0 auto;
	padding: 25px 0 0;
	position: relative;
	text-align: center;
	text-shadow: 0 1px 0 #fff;
	width: 400px;
	
	outline: 0 !important;
}

#content h3 {
	font-family: 'Offside', sans-serif;
	letter-spacing: -0.07em;
	margin: 10px 0;
	font-size: 28px;
	font-weight: 300;
	padding: 0px 10px 4px 10px;
}
#content h3 span#connectTextTM{
	font-family: 'Lato', sans-serif;
}
#content h3:before,
#content h3:after {
	content: "";
	height: 1px;
	position: absolute;
	top: 10px;
	width: 23%;
}
#content h3:after {
	background: rgb(126,126,126);
	background: -moz-linear-gradient(left,  rgba(126,126,126,1) 0%, rgba(255,255,255,1) 100%);
	background: -webkit-linear-gradient(left,  rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%);
	background: -o-linear-gradient(left,  rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%);
	background: -ms-linear-gradient(left,  rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%);
	background: linear-gradient(left,  rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%);
    right: 0;
	margin: 7px 0;
	xmargin: 23px 0;
}
#content h3:before {
	background: rgb(126,126,126);
	background: -moz-linear-gradient(right,  rgba(126,126,126,1) 0%, rgba(255,255,255,1) 100%);
	background: -webkit-linear-gradient(right,  rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%);
	background: -o-linear-gradient(right,  rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%);
	background: -ms-linear-gradient(right,  rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%);
	background: linear-gradient(right,  rgba(126,126,126,1) 0%,rgba(255,255,255,1) 100%);
    left: 0;
	margin: 7px 0;
	xmargin: 23px 0;
}



#content:after,
#content:before {
	background: #f9f9f9;
	background: -moz-linear-gradient(top,  rgba(248,248,248,1) 0%, rgba(249,249,249,1) 100%);
	background: -webkit-linear-gradient(top,  rgba(248,248,248,1) 0%,rgba(249,249,249,1) 100%);
	background: -o-linear-gradient(top,  rgba(248,248,248,1) 0%,rgba(249,249,249,1) 100%);
	background: -ms-linear-gradient(top,  rgba(248,248,248,1) 0%,rgba(249,249,249,1) 100%);
	background: linear-gradient(top,  rgba(248,248,248,1) 0%,rgba(249,249,249,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f8f8f8', endColorstr='#f9f9f9',GradientType=0 );
	border: 1px solid #c4c6ca;
	content: "";
	display: block;
	height: 100%;
	left: -1px;
	position: absolute;
	width: 100%;
}
#content:after {
	-webkit-transform: rotate(2deg);
	-moz-transform: rotate(2deg);
	-ms-transform: rotate(2deg);
	-o-transform: rotate(2deg);
	transform: rotate(2deg);
	top: 0;
	z-index: -1;
}
#content:before {
	-webkit-transform: rotate(-3deg);
	-moz-transform: rotate(-3deg);
	-ms-transform: rotate(-3deg);
	-o-transform: rotate(-3deg);
	transform: rotate(-3deg);
	top: 0;
	z-index: -2;
}
#content form { margin: 0 20px; position: relative }
#content form input[type="text"],
#content form input[type="password"],
#content form input[type="email"] {
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-ms-border-radius: 3px;
	-o-border-radius: 3px;
	border-radius: 3px;
	-webkit-box-shadow: 0 1px 0 #fff, 0 -2px 5px rgba(0,0,0,0.08) inset;
	-moz-box-shadow: 0 1px 0 #fff, 0 -2px 5px rgba(0,0,0,0.08) inset;
	-ms-box-shadow: 0 1px 0 #fff, 0 -2px 5px rgba(0,0,0,0.08) inset;
	-o-box-shadow: 0 1px 0 #fff, 0 -2px 5px rgba(0,0,0,0.08) inset;
	box-shadow: 0 1px 0 #fff, 0 -2px 5px rgba(0,0,0,0.08) inset;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
	background: #eae7e7 url(../images/username-and-password.png) no-repeat;
	border: 1px solid #c8c8c8;
	color: #777;
	font: 16px Helvetica, Arial, sans-serif;
	margin: 0 0 10px;
	padding: 13px 5px 17px 45px;
	width: 80%;
	
	
}
#content form input[type="text"]:focus,
#content form input[type="password"]:focus,
#content form input[type="email"]:focus {
	-webkit-box-shadow: 0 0 2px #ed1c24 inset;
	-moz-box-shadow: 0 0 2px #ed1c24 inset;
	-ms-box-shadow: 0 0 2px #ed1c24 inset;
	-o-box-shadow: 0 0 2px #ed1c24 inset;
	box-shadow: 0 0 2px #ed1c24 inset;
	background-color: #fff;
	border: 1px solid #ed1c24;
	outline: none;
}
#username { background-position: 10px 10px !important }
#pw { background-position: 10px -53px !important }
form input[type="submit"], form input[type="button"] {
	background: rgb(254,231,154);
	background: -moz-linear-gradient(top,  rgba(254,231,154,1) 0%, rgba(254,193,81,1) 100%);
	background: -webkit-linear-gradient(top,  rgba(254,231,154,1) 0%,rgba(254,193,81,1) 100%);
	background: -o-linear-gradient(top,  rgba(254,231,154,1) 0%,rgba(254,193,81,1) 100%);
	background: -ms-linear-gradient(top,  rgba(254,231,154,1) 0%,rgba(254,193,81,1) 100%);
	background: linear-gradient(top,  rgba(254,231,154,1) 0%,rgba(254,193,81,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fee79a', endColorstr='#fec151',GradientType=0 );
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	-ms-border-radius: 30px;
	-o-border-radius: 30px;
	border-radius: 30px;
	-webkit-box-shadow: 0 1px 0 rgba(255,255,255,0.8) inset;
	-moz-box-shadow: 0 1px 0 rgba(255,255,255,0.8) inset;
	-ms-box-shadow: 0 1px 0 rgba(255,255,255,0.8) inset;
	-o-box-shadow: 0 1px 0 rgba(255,255,255,0.8) inset;
	box-shadow: 0 1px 0 rgba(255,255,255,0.8) inset;
	border: 1px solid #D69E31;
	color: #85592e;
	cursor: pointer;
	float: left;
	font: bold 15px Helvetica, Arial, sans-serif;
	height: 35px;
	margin: 20px 0 35px 10px;
	position: relative;
	text-shadow: 0 1px 0 rgba(255,255,255,0.5);
	width: 120px;
}
form input[type="submit"]:hover, form input[type="button"]:hover {
	background: rgb(254,193,81);
	background: -moz-linear-gradient(top,  rgba(254,193,81,1) 0%, rgba(254,231,154,1) 100%);
	background: -webkit-linear-gradient(top,  rgba(254,193,81,1) 0%,rgba(254,231,154,1) 100%);
	background: -o-linear-gradient(top,  rgba(254,193,81,1) 0%,rgba(254,231,154,1) 100%);
	background: -ms-linear-gradient(top,  rgba(254,193,81,1) 0%,rgba(254,231,154,1) 100%);
	background: linear-gradient(top,  rgba(254,193,81,1) 0%,rgba(254,231,154,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fec151', endColorstr='#fee79a',GradientType=0 );
}
input[type="submit"]:disabled, input[type="button"]:disabled {
	background:#ddd;
	border: 1px solid #ccc;
	color: #555;
	
}

#content form div a {
	color: #004a80;
    font-size: 16px;
    float: right;
    margin: 23px 10px 0 0;
	text-decoration: underline;
	font-weight: normal;
}
#content form div a:hover {
	text-decoration: none;
	font-weight: normal;
	text-shadow: none;
}

.placeholderFix{color:#999}

.hidden{
	visibility:hidden;
	display:none;
}
.ZeroHeight{
	height:0px;
}
div.divEULA{
	border: 1px dashed #ccc;
	height: 400px;
	width: 96%;
	overflow-y: scroll;
	padding: 8px;
	font-family: "Courier New", Courier, monospace;
	color: #666;
	margin: 10px;
}
div.divEULA p{
	padding: 0 0 15px 0;
}

div.section{
	border-width: 1px;
	border-style: solid;
	float: left;
	margin: 10px 0 0 10px;
	position: relative;
	width: 98%;
	_display: inline;
	padding: 0;
	-moz-border-radius: 7px;
	-moz-border-radius-topleft: 0;
	-moz-border-radius-topright: 0;
	border-radius: 7px;
	border-top-left-radius:0;
	border-top-right-radius:0;
	border-color: #B5B5B5;
	background: #f9f9f9;
	padding-bottom: 10px;
}
div.section h2{
	font-family: 'Abel', sans-serif;
	color: #002537;
	margin: 0 0 10px 0;
	font-size: 22px;
	font-weight: 300;
	padding: 4px 0;
	text-indent: 6px;
	letter-spacing: 0px;
	width: 100%;
	background: #C2E0FF;
}

div.instructions{
	font-family: 'Abel', sans-serif;
	font-size: 14px;
	background: white;
	border: 1px dashed #ccc;
	padding: 4px 6px;
	margin-bottom: 0.5em;
}
div.instructions p{
	padding: 5px 10px;
}

div.msgSuccess{
	font-family: 'Abel', sans-serif;
	margin: 2em;
	font-size: 18px;
	background: white;
	border: 1px dashed #ccc;
	padding: 4px 6px;
}
div.msgSuccess p{
	padding: 10px 20px;
}
form.register{
	margin: 20px;
}
form.register .note{
	color: #C10000; /* #914840 KL 9/19/17 */
}
form.register p.required{
	float: left;
	margin-left: 114px;
	padding: 0; 
	color: #C10000; /* #914840 KL 9/19/17 */
	font-size: 12px;
	width: 100%;
	margin-bottom: 20px
}
form.register p.info{
	float: left;
	margin: 0 0 6px 114px;
	padding: 0;
	color: #444;
	font-size: 12px;
	width: 100%;
}

form.register label{
	display: block;
	clear: left;
	float: left;
	width: 100px;
	text-align: right;
	margin-right: 10px;
	padding-top: 3px;
}
form.register input{
	width: 216px;
}
form.register label, form.register input{
	margin-top: 4px;
	margin-bottom: 2px;
}
form.register label.register2{
	width: 150px;
}

form.register input.register2{
	display: block;
	float: left;
	width: 200px;
	margin-bottom: 6px;
}
	
/* password strength */
#passwordStrengthLabel{
	display: none;
}
div#passwordStrengthLabel{
		text-align: right;
		width: 150px;
		float: left;
}
#pwStrengthLabel{
		background:yellow; 
		text-align: right;
		width: 150px;
}
#passwordDescription{
	padding: 1px 4px 4px 4px;
	font-family: 'Abel', sans-serif;
	font-size: 14px;
	letter-spacing: 1px;
	font-weight: 600;
	color: #000;
	text-transform: uppercase;
}
#passwordStrength
{
  height:20px;
  display:block;
  float:left;
  color: #333;
}

.strength0
{
	width:100px;
	background:#ccc;
	background: #FF8E8E;
}

.strength1
{
	width:100px;
	width:120px;
	background:#ff0000;
	background:#FF9999;
}

.strength2
{
	width:120px;    
	width:140px;    
	background:#ff5f5f;
	background:#9DBDFF;
}

.strength3
{
	width:150px;
	width:160px;
	background:#56e500;
	background:#8AE6B8;
}

.strength4
{
	background:#4dcd00;
	width:200px;
	width:180px;
	background:#75D0A2;
}

.strength5
{
	background:#399800;
	background:#6CDA6C;
	width:250px;
	width:204px;
}

/* end password strength */

form.register .submitButton{
	float: left;
	margin-left: 112px;
	margin-top: 12px;
	
}
form.register .submitButton2{
	float: left;
	margin-left: 48px;
	width:208px;
}

div.errors {
	margin-bottom: 20px;
	color: #C10000; /* #914840 KL 9/19/17 */
	font-weight: 600;
	font-size: 12px;
	font-family: 'Abel', sans-serif;
	font-family: Arial;
}

footer{
	padding: 10px;
	background-color: #ccc;
	width: 100%;
	border-top: 1px dashed #888;
	z-index: 999; /* less than .container so that the footer slides behind it when the browser is sized down to where the footer overlaps with page contents */
}
.push { /* helps keep the footer sticky at the bottom */
	height: 4em;
}


section#copyright{
	font-family: 'Abel', sans-serif;
	font-size: 15px;
	text-align: center;
	padding: 10px 0;
	color: #383737; /* #914840 KL 9/19/17 */
}
address{
	font-family: 'Abel', sans-serif;
	font-size: 17px;
	text-align: center;
	padding: 10px 0;
	color: #111;
	font-style: normal;
}
address a{
	color: #111 !important;
}