BODY {
    margin: 0px;
    padding: 0px;
    font: normal 10px Helvetica, Arial, sans-serif;
}

/*-----------------------------------------------------------
LOG IN
-----------------------------------------------------------*/
BODY {
    background-image: url(../images/bg-gradient.jpg);
    background-repeat: repeat-x;
    background-position: 0 0;
}
SUP {
    vertical-align: super;
    font-size: 0.83em;
}

/*PANEL*/
.splash-panel {
    height: 425px;
    width: 700px;
    position: relative;
    /*background-image: url(images/ellucian-signin-panel.png);*/
	margin-top: 140px;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;
    background-color: #FFFFFF;
    border-radius: 6px;
    box-shadow: 6px 6px 10px #888888;
    border: 2px solid #CCC;
}
.ellucian-banner {
    background: -moz-linear-gradient(left, rgba(66,36,92,1) 0%, rgba(169,29,101,1) 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(66,36,92,1)), color-stop(100%, rgba(169,29,101,1)));
    background: -webkit-linear-gradient(left, rgba(66,36,92,1) 0%, rgba(169,29,101,1) 100%);
    background: -o-linear-gradient(left, rgba(66,36,92,1) 0%, rgba(169,29,101,1) 100%);
    background: -ms-linear-gradient(left, rgba(66,36,92,1) 0%, rgba(169,29,101,1) 100%);
    background: linear-gradient(to right, rgba(66,36,92,1) 0%, rgba(169,29,101,1) 100%);
 	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#42245c', endColorstr='#a91d65', GradientType=1 );
    height: 115px;
    position: relative;
    top: 40px;
}

/*PRODUCT NAME*/
.product-name-heavy {
    font-family: Helvetica, Arial, sans-serif;
    font-weight: bold;
    font-size: 32px;
    position: relative;
    top: 30px;
    left: 80px;
    color: #FFFFFF;
}
.product-name-light {
    font-family: Helvetica, Arial, sans-serif;
    font-size: 20px;
    line-height: 20px;
    position: relative;
    top: 32px;
    left: 80px;
    color: #FFFFFF;
}

/*FORM*/
.login-message {
    color: #333333;
    font-size: 14px;
    margin: 60px 0 0 80px;
    -webkit-transition: color 1s;
    -moz-transition: background 1s;
    -ms-transition: background 1s;
    -o-transition: background 1s;
    transition: background 1s;
}

.login {
    margin: 10px 0 0 80px;
    width: 100%;
    position: relative;
}
.splash-panel .login DIV {
    float: left;
}
DIV.input-field-login.icon {
    height: 32px;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    -khtml-border-radius: 4px;
    -webkit-box-shadow: inset 0 10px 10px #E9E9E9;
    -moz-box-shadow: inset 0 10px 10px #E9E9E9;
    box-shadow: inset 0 10px 10px #E9E9E9;
    border: 1px solid #BEBEBE;
    background-repeat: no-repeat;
}
HTML[dir="ltr"] DIV.icon .signin-textbox {
    margin-left: 26px;
}
HTML[dir="rtl"] DIV.icon .signin-textbox {
    margin-right: 26px;
}
.signin-textbox {
    border-style: none;
    outline: none;
    background: transparent;
    height: 22px;
    font-size: 1.4em;
}
INPUT.signin-textbox 
{
    margin: 4px 0;
    width: 110px;
}
SELECT.signin-textbox
{
    margin: 5px 0;
    width:145px;
    -webkit-appearance: none;
}

INPUT::-webkit-input-placeholder {
 font-family: Georgia, serif;
 color: #7F7F7F;
 font-style: italic;
}
INPUT:-moz-placeholder {
 color: #7F7F7F;
 font-family: Georgia, serif;
 font-style: italic;
}
INPUT:-ms-input-placeholder {
 font-family: Georgia, serif;
 color: #7F7F7F;
 font-style: italic;
}
INPUT:focus::-webkit-input-placeholder {
 color: #AAAAAA;
 -webkit-transition: color .2s;
}
INPUT:focus:-moz-placeholder {
 color: #CCCCCC;
 transition: color 0.2s;
}
INPUT:focus:-ms-input-placeholder {
 color: #AAAAAA;
 -ms-transition: color .2s;
}
DIV.username {
    background-image: url(../images/icon-username.png);
    background-position: 5px 5px;
}
.username {
    margin-right: 10px;
    width: 140px;
    height: 24px;
}
DIV.password {
    background-image: url(../images/icon-pwd.png);
    background-position: 5px 5px;
}
.password {
    margin-right: 10px;
    width: 140px;
    height: 24px;
}
DIV.database {
    background-image: url(../images/icon-database.png);
    background-position: 5px 5px;
}
.database {
    margin-right: 10px;
    width: 180px;
    height: 24px;
}

/*OPTIONAL FORGOT PWD LINK*/
.forgot-password {
    color: #006699 !important;
    font-size: 1.2em !important;
}
#forgotPassword {
    float: left;
    margin: 10px 0 0 5px;
    visibility: hidden;  /*  set to "hidden" to remove */
}
.forgot-username {
    color: #006699 !important;
    font-size: 1.2em !important;
}
#forgotUsername {
    float: left;
    margin: 10px 0 0 5px;
    visibility: hidden;  /*  set to "hidden" to remove */
}

/* BUTTON STATES */
.signin-button-wrapper {
    position: relative;
    bottom: 2px;
    float: left;
}
.primary-button {
    font-size: 1.2em;
    color: #FFFFFF;
    padding: 0.7em 2em;
    background: -moz-linear-gradient(top, #999999 0%, #575757);
    background: -webkit-gradient(linear, left top, left bottom, from(#999999), to(#575757));
    background-image: -ms-linear-gradient(90deg, #999999, #575757);
    background-image: -o-linear-gradient(90deg, #999999, #575757);
 	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#999999', endColorstr='#575757');
    border-radius: 0.6em;
    -moz-border-radius: 0.6em;
    -webkit-border-radius: 0.6em;
    border: 0.1em solid #333333;
    box-shadow: inset 0 0 3px, inset 0 1px 0 rgba(255, 255, 255, 0.8);
    -moz-box-shadow: 0 0 3px inset, 0 1px 0 rgba(255, 255, 255, 0.8) inset;
    -webkit-box-shadow: 0 0 3px inset, 0 1px 0 rgba(255, 255, 255, 0.8) inset;
    text-shadow: 0px -0.1em rgba(51, 51, 51, 1);
    -webkit-transition: background 1s;
    -moz-transition: background 1s;
    -ms-transition: background 1s;
    -o-transition: background 1s;
    transition: background 1s;
}
.primary-button:hover {
    color: #FFFCF2;
    background: -moz-linear-gradient(top, #AAAAAA 0%, #676767);
    background: -webkit-gradient(linear, left top, left bottom, from(#AAAAAA), to(#676767));
 	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#AAAAAA', endColorstr='#676767');
    box-shadow: inset 0 0 5px, inset 0 1px 0 rgba(255, 255, 255, 0.8);
    -moz-box-shadow: 0 0 5px inset, 0 1px 0 rgba(255, 255, 255, 0.8) inset;
    -webkit-box-shadow: 0 0 5px inset, 0 1px 0 rgba(255, 255, 255, 0.8) inset;
    text-shadow: 0px -0.1em rgba(51, 51, 51, 1);
}

/*Bottom Panel Content*/
.copyright-container {
    border-top: 1px solid #DDD;
    width: auto;
    margin: 30px 80px 0px;
    float: left;
}
.company-logo {
    margin: 50px 0 0 0px;
    float: left;
}
.copyright {
    font-size: 11px;
    line-height: 15px;
    width: auto;
    margin-left: 150px;
    margin-top: 30px;
    color: #B2B2B2;
}

/* IE WARNING STATES*/
.ie-warning {
    visibility: hidden;  /*  set to "visible" for warning state; "hidden" to remove */
    background: #FDF5B3 url(../images/icon-warning-32x32.png) no-repeat 8px 8px;
    margin: 0px auto;
    border: 1px solid #FFCC33;
    border-radius: 2px;
    /*for IE 9*/
	position: absolute;
    top: -72px;
    width: 100%;
    height: 58px;
    /*+box-shadow:4px 5px 5px #888888;*/
	-moz-box-shadow: 4px 5px 5px #888888;
    -webkit-box-shadow: 4px 5px 5px #888888;
    -o-box-shadow: 4px 5px 5px #888888;
    box-shadow: 4px 5px 5px #888888;
}
.ie-warning DIV {
    color: #333333;
    margin: 10px;
    padding-left: 45px;
    font-size: 12px;
    line-height: 18px;
}
.ie-warning SPAN {
    font-weight: bold;
    font-size:14px;
}

/*ERROR STATES*/
.input-field-login.icon.username.error-state {
    border: 2px solid #c00;
    position:relative;
    top:-2px;
}
DIV.username.error-state {
    background-image: url(../images/icon-username-error.png);
    background-position: 5px 5px;
}
.input-field-login.icon.password.error-state {
    border: 2px solid #c00;
    position:relative;
    top:-2px;
}
DIV.password.error-state {
    background-image: url(../images/icon-pwd-error.png);
    background-position: 5px 5px;
}
.error-message {
    visibility: hidden;  /*  set to "visible" for error state, "hidden" to remove */
    background: #EBCFCF url(../images/icon-error-32x32.png) no-repeat 10px 10px;
    margin: 0px auto;
    border: 1px solid #DC6F6E;
    border-radius: 2px; /*for IE 9*/
    position: absolute;
    top: -72px;
    width: 100%;
    height: 51px;
    -moz-box-shadow: 4px 5px 5px #888888;
    -webkit-box-shadow: 4px 5px 5px #888888;
    -o-box-shadow: 4px 5px 5px #888888;
    box-shadow: 4px 5px 5px #888888;
}
.error-message DIV {
    color: #333333;
    margin: 18px 52px;
    font-size: 1.4em;
    font-weight:bold;
}