﻿#login .header, #login .loginArea { width: 700px; margin: 0 auto; }

#login .loginArea .loginContainer {
border: 1px solid #b5b5b5;
border-radius: 5px;
}

.inputContainer, .signupContainer {
	display: table-cell;
    vertical-align: top;
}

.inputContainer {
    width: 265px; /* 255 looks good everywhere but edge */
    text-align: right;
	padding-right: 70px;
}

.inputContainer img { display: block; }

.inputContainer .button {
    background: #10092a;
    color: white;
    border-radius: 3px;
}

	.inputContainer .button:hover {
        background: #5b2ff1;
    }

.inputContainer > * {
    margin-bottom: 10px;
    display: inline-block;
    vertical-align: middle;
}
#LoginButton { margin-right: 6px; }


.logoContainer {
	padding: 20px;
}

.logoContainer img {
    width: 50%;
}

.copyright {
	padding: 10px 0px 10px 25px;
}

.boxBorder {
	border-left: 1px solid #b5b5b5;
	border-right: 1px solid #b5b5b5;
}

.loginContainer { padding: 15px; }
.signupContainer {
padding: 20px;
border: 1px solid #b5b5b5;
border-radius: 5px;
box-shadow: inset 0 0 20px #cfcfcf;
}

.signupContainer h1 {
font-size: 25px;
color: #1993ca;
margin: 0 0 10px 0;
}

.signupBackground {
	width: 294px;
	height: 170px;
	background-image: url(/images/login/bg_signup.gif);
}

.signup {
	padding: 20px 20px 20px 30px;
}

.signup h1 {
	font-size: 25px;
	color: #1993ca;
	margin: 0 0 10px 0;
}

.newsContainer {
	padding: 15px 25px 10px 25px;
}

/* Okta css is very specific, so overrides must be even moreso */
#okta-sign-in div.okta-sign-in-header {
    padding: 0;
}

/* this removes the padding when the profile image (the beacon) isn't visible. 
	not sure if it ever is, but the extra padding isn't needed when it's gone.
*/
#okta-sign-in.no-beacon div.okta-sign-in-header {
    padding-bottom: 0;
}

#okta-sign-in div.okta-sign-in-header img {
    max-width: initial;
    max-height: initial;
    width: 50%;
}

#okta-sign-in #idp-discovery-submit {
	background: #10092a;
    border-color: #10092a;
}

@media screen and (max-width: 700px) {
	body, #login .header, #login .loginArea { width: 100%; }
	#login .loginArea { padding: 0 4% 0; width: 92%; }
	.inputContainer, .signupContainer { display: block; width: auto; }
	.inputContainer { width: 70%; }
	.inputContainer #UserName, .inputContainer #Password { padding: 4% 5px; }
}