body {
	background:				#0072BC url(/images/login/bodyBG.png) repeat-x;
	background-position:	top;

	font-family:			Arial, Helvetica, sans-serif;
	font-size:				12px;
	color:					#ffffff;

	margin:					0;
	padding:				0;
}

a {
	text-decoration:		none;
	color:					inherit;
}
a:hover {

	text-decoration:		underline;
}

a#helpdesk {
    text-decoration:		underline;
}

div {
	display:				block;
	position:				relative;
	margin:					0;
	padding:				0;
	width:					auto;
	height:					auto;
	border:					0;
}

input {
	display:				inline-block;
	background:				#ffffff;
	border:					1px solid #000000;
	width:					250px;
	height:					30px;
	line-height:			28px;
	font-family:			Arial, Helvetica, sans-serif;
	font-size:				14px;
	color:					#000000;
	text-align:				left;
	padding:				0 5px 0 5px;
	margin:					0;
	outline:				none;
}

div#loginWrapper {
	width:					800px;
	margin:					0 auto;
}

	div#loginWrapper > div.logo {
		width:					750px;
		height:					290px;
		margin:					40px auto 50px auto;
		background:				transparent url(/images/login/logo.png) no-repeat;
	}

	div#loginWrapper > div.textA,
	div#loginWrapper > div.textB{
		text-align:				center;
	}

	div#loginWrapper > div.textA {
		font-size:				22px;
		line-height:			26px;
		font-weight:			bold;
	}

	div#loginWrapper > div.textB {
		font-size:				14px;
		line-height:			17px;
		color:					#99BED9;
		margin:			        10px 0 30px;
	}

    div#loginWrapper > div.textC {
		font-size:				14px;
		line-height:			28px;
		margin-bottom:			30px;
	}

	form#loginForm{
		display:				block;
		position:				relative;
		width:					530px;
		height:					auto;
		text-align:				center;
		margin:					0 auto 40px auto;
	}

    form#signupForm,
    form#forgotPswForm,
    form#resetPswForm,
    form#changeForcePswForm,
    form#loginForm {
		display:				block;
		position:				relative;
		width:					510px;
		height:					auto;
		margin:					0 auto 40px auto;
	}
    form#loginForm {
        margin:					0 auto;
        width:					530px;
    }

        input[type=text][class~=valid], input[type=password][class~=valid]{
            border: 			1px solid #05c800;
            background:			#e6f9e5;
        }

        input[type=text][class~=invalid], input[type=password][class~=invalid]{
            border: 			1px solid #ED1C24;
            background:			#FABEC1;
        }

		input
        {
			display:		    block;
			color:				#000000;
		}

		input[class~=valid]
        {
			background-position: 	225px center;
			border: 				2px solid #00D02C;
		}

		input#loginUsername {
			float:					left;
		}

		input#loginPassword {
			float:					right;
			display:				none;
		}

		input#loginPasswordPlain {
			float:					right;
		}

        div.label {
            float:                  left;
            width:                  175px;
            text-align:             right;
            font-size:              14px;
            height:                 30px;
            vertical-align:         middle;
            margin:                 5px 0px;
        }

        div.data {
            float:                  left;
            margin-left:            10px;
            width:                  262px;
        }

		div#loginBtn{
			width:					200px;
			margin:					0 auto;
            padding:                15px 0;
		}

        div#submitBtn{
			width:					195px;
			padding:				0 33px 0 34px;
		}

         input#loginButton,
         input#signupButton,
         input#forgotPswButton,
         input#setUpNewPswButton,
         input#changePswButton {
             background:		     transparent url(/images/login/button.png) no-repeat;
             cursor:                 pointer;
             width:                  174px;
             border:                 0;
             font-size:              12px;
             font-weight:            bold;
             text-align:             center;
             padding-bottom:         4px;
             float:                  left;
         }

         input#loginButton.disabled,
         input#signupButton.disabled,
         input#forgotPswButton.disabled,
         input#setUpNewPswButton.disabled,
         input#changePswButton.disabled{
            background:		        transparent url(/images/login/button_disabled.png) no-repeat;
            color:                  #363636;
            cursor:                 default;
         }

         img.submitSpinner{
            opacity: 0;
            filter:alpha(opacity=0); /* For IE8 and earlier */
            height:                 16px;
            margin-left:            5px;
            padding:                6px 0 7px 0;
            float:                  left;
        }
        img.submitSpinner[class~=on] {
            opacity: 1;
            filter:alpha(opacity=100); /* For IE8 and earlier */
        }

	div#loginWrapper > div.links {
		text-align:				center;
		color:					#b8d1e6;
		line-height:			22px;
		margin-bottom:			30px;
	}
         div#loginWrapper > div.links > a {
            color:				#b8d1e6;
		}
        div#loginWrapper > div.links > a:hover {
            text-decoration:    underline;
        }

	div#loginWrapper > div.footerText {
		text-align:				center;
		font-size:				10px;
		line-height:			14px;
		color:					#6f9fc9;
		margin-bottom:			15px;
	}
        div#loginWrapper > div.footerText > a {
            color:					#6f9fc9;
		}
        div#loginWrapper > div.footerText > a:hover {
            text-decoration:    underline;
        }

	div#loginWrapper > div.footerLinks {
		text-align:				center;
		font-size:				10px;
		color:					#6f9fc9;
		margin-bottom:			50px;
	}

		div#loginWrapper > div.footerLinks > a {
			margin:					0 15px 0 15px;
            color:					#6f9fc9;
		}
        div#loginWrapper > div.footerLinks > a:hover {
            text-decoration:    underline;
        }

div#ajax_error, div#flash_error  {
    width:				530px;
    margin:		        0 auto 30px auto;
    border: 			1px solid #ED1C24;
    background:			#FABEC1;
    padding:			10px;

    -webkit-box-sizing:		border-box;
    -moz-box-sizing: 		border-box;
    box-sizing: 			border-box;
}
div#ajax_info, div#flash_info  {
    width:				530px;
    margin:		        0 auto 30px auto;
    background:			#f0f0f0;
	border:				1px solid #bfbfbf;
    padding:			10px;

    -webkit-box-sizing:		border-box;
    -moz-box-sizing: 		border-box;
    box-sizing: 			border-box;
}

div.errorText {
        font-weight:		bold;
        color:				#9e0b0f;
        font-size:			14px;
        margin-bottom:		10px;
        text-align:         left;
 }

div.infoText {
        font-weight:		bold;
        color:				#3074a6;
        font-size:			14px;
        margin-bottom:		10px;
        text-align:         left;
 }

div#usersGuide {
        margin:             0 auto 20px;
        width:              331px;
        height:             73px;
        background:		    transparent url(/images/login/ppug-buttonLg.png) no-repeat;
        border:             0;
        font-weight:        bold;
        padding:            10px 5px 10px 80px;
        color:              #938a02;
}

div#usersGuideLink, div#videoTutorialLink {
        cursor:             pointer;
}

