html, body {    width: 100%;    height: 100%;}
/*Bootstrap-overlay*/

body
{
 overflow-x: hidden;
 margin-top: -10px;  font-family: 'Open Sans', sans-serif; font-size:12px; color:#666;
}

.login-top-bg {
    background: #f8f8f8; clear: none; height: auto;
    border-bottom: 1px solid #d6d6d6;
    border-top: 15px solid #194bab;
    box-shadow: 1px 3px 3px #d6d6d6;
    color: #000;
    margin: 0 auto 7px;
    position: relative;
    width: 100%;
}
.login-mid-bg {
    border-bottom: 1px solid #194bab;
    box-shadow: 0px 10px 30px #ebebeb;
    color: #000;
    margin: 0 auto;
    padding: 10px 0 15px 0;
    position: relative;
    width: 100%;
}
.login-content-bg {
    background:#fff;
    padding:7px;
    border:1px solid #c7c7c7;
}
.login-content-authentication-bg {
    background:#fff;
    padding:15px;
    border:1px solid #c7c7c7;
}
.login-mss-text {
    margin:25px 0px 0px 66px;;
}
.login-banner {
    margin:0px;
    padding:0px;
}
.login-error {
    color: #f00;
    width: 560px;
    text-align: center;
    margin-bottom: 5px;

}
.login-error-left {
    color: #f00;
    text-align: left;
    padding:0px 0px 10px 0px;
}
.login-icon-position {
    margin-right:-4px;
    padding:9px 9px !important;
}
.btn-login-success {
    width:76.2% !important;
    height:38px !important;
    font:lighter 18px 'Open Sans',sans-serif;
}
.btn-login-info {
    width:71.2% !important;
    height:24px !important;
    font:lighter 18px 'Open Sans',sans-serif;
}
.btn-login-continue {
    width:auto !important;
    height:38px !important;
    font:lighter 18px 'Open Sans',sans-serif;
}
.login-agree-terams {
    padding:0px;
    margin:0px;
    display:inline-block;
}
a{color:#666;}
a:hover, a:focus {
 text-decoration: none; color:#2f96b4;
}
.dropdown-menu .divider{ margin:4px 0px;}
.dropdown-menu{ min-width:180px;}
.dropdown-menu > li > a{ padding:3px 10px; color:#666; font-size:12px;}
.dropdown-menu > li > a i{ padding-right:3px;}
.userphoto img{ width:19px; height:19px;}
select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input, .label, .dropdown-menu, .btn, .well, .progress, .table-bordered, .btn-group > .btn:first-child, .btn-group > .btn:last-child, .btn-group > .btn:last-child, .btn-group > .dropdown-toggle, .alert{ border-radius:0px;}
.btn, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input{ box-shadow:none;}
.progress, .progress-success .bar, .progress .bar-success, .progress-warning .bar, .progress .bar-warning, .progress-danger .bar, .progress .bar-danger, .progress-info .bar, .progress .bar-info, .btn, .btn-primary{background-image:none;}
.accordion-heading h5{ width:70%; }
.form-horizontal .form-actions{ padding-left:20px; }
.form-horizontal .form-actions-buttons{ padding-left:20px; }
#footer{ padding:10px; text-align:center;}
hr{ border-top-color:#dadada;}
.carousel{ margin-bottom:0px;}
.fl { float:left}
.fr {float:right}
.label-important, .badge-important{ background:#f74d4d;}

/*Metro Background color class*/
.bg_lb{ background:#27a9e3;}
.bg_db{ background:#2295c9;}
.bg_dt{ background:#4a4a4a;}
.bg_lg{ background:#b7181a;}
.bg_dg{ background:#28b779;}
.bg_ly{ background:#ffb848;}
.bg_dy{ background:#da9628;}
.bg_ls{ background:#2255a4;}
.bg_lo{ background:#da542e;}
.bg_lr{ background:#f74d4d;}
.bg_lv{ background:#603bbc;}
.bg_lh{ background:#b6b3b3;}
.bg_dh{ background:#909090;}
.bg_lhlogin{ background:#eff0f1;}

body { background-color:#fff;    padding: 0;    /* margin-top:10%; */ }
/*.login-bg { background: #fff url('../Images/login-bg.jpg') repeat-x left top; clear: none; height: auto; }*/
.login-bg { border-top:20px solid #194bab; background:#f8f8f8; }
#logo, .loginbox {    width: 32%;    margin-left: auto;    margin-right: auto; padding:0; position: relative;}
#logo img {  margin: 0 auto;    display: block;}
.loginbox { overflow: hidden !important;    text-align: left;    position: relative; }
.loginbox form{ width:100%; /*background:#fcfcfc;*/ position:relative; top:0; left:0; }
.loginbox .form-actions { padding: 0px 0px 5px;}
.loginbox .form-actions-buttons{ padding: 0px 20px 15px;}
.loginbox .form-actions .pull-left { margin-top:0px;}
.loginbox .form-actions-buttons .pull-left { margin-top:0px;}
.loginbox form#wfmLogin form#frmMain form#wfmChangePassword form#wfmLoginInternal form#wfmLoginExternal form#wfmForgotUserID form#wfmResetPassword form#wfmSelectEmployer { z-index: 200; display:block;}/* default loginform id changed to as per the development id wfmLoginInternal*/
.loginbox form#recoverform { z-index: 100;     display:none;}
.loginbox form#recoverform .form-actions {    margin-top: 10px;}
.loginbox form#recoverform .form-actions-buttons {    margin-top: 10px;}
.loginbox .main_input_box { margin:0 auto; text-align:center; font-size:13px;}
.loginbox .main_input_box_left { margin:0 auto; text-align:left; font-size:13px;}
.loginbox .main_input_box select { margin:0 auto; text-align:left; margin-right:10px; width:55.7%; height: 35px; font: lighter 18px 'Open Sans',sans-serif;}
.loginbox .main_input_box .add-on{  padding:12px 9px; *line-height:31px; color:#fff;  width:30px; display:inline-block; text-align:c
.loginbox .main_input_box input{ border:0px; display:inline-block; line-height:28px;  margin-bottom:3px; border:1px solid #cdcfd2; }
fd2; }
.loginbox .main_input_box input[type="checkbox"]{ height:28px; border:0px; display:inline-block; width:auto; line-height:28px;  margin-bottom:5px; border:1px solid #cdcfd2; }
.loginbox .controls{ padding:0 20px 0 20px;}
.loginbox .controls-left{ padding:0 20px 0 0px;}
.loginbox .control-group{ padding:10px 0px 10px 0px; margin-bottomcenter:0px;}
.form-vertical, .form-actions {  margin-bottom: 0; background:none; /*border-top:1px solid #cdcfd2;*/ }
.form-vertical, .form-actions-buttons{  margin-bottom: 0; background:none; /*border-top:1px solid #cdcfd2;*/ }
.loginbox .normal_text{ padding:15px 10px; /*text-align:;*/ font-size:14px; line-height:20px; /*background:#fff;*/ color:#fff; }
.loginbox .error_text{ padding:15px 10px; /*text-align:;*/ font-size:14px; line-height:20px; /*background:#fff;*/ color:#f00; }
@media (max-width:800px){
#logo { width: 60%; }
.loginbox{ width:80%}
}
@media (max-width: 480px){
#logo { width: 40%; }
.loginbox{ width:90%}
.loginbox .control-group{ padding:8px 0; margin-bottom:0px;}
}

.box-type-login {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  height: 100%;
  min-height: 525px;
}
.box-type-login:before {
  content: "";
  position: absolute;
  margin: auto;
  left: 0;
  right: 0;
  /*top: 0;*/
  top:-45%;
  bottom: 0;
  height: 325px;
  max-height: 100%;
  width: 100%;
  border-top:1px solid #cdcfd2;
  border-bottom:1px solid #cdcfd2;
  background-repeat: repeat-x;
  background-image: -webkit-linear-gradient(20deg, #fcfcfc, #fcfcfc);
  background-image: linear-gradient(20deg, #fcfcfc, #fcfcfc);
}
.box-type-login .box {
  position: static;
}
.box-type-login .box .box-head {
  position: absolute;
  margin: auto;
  left: 0;
  right: 0;
  bottom: 0;
  top: -425px;
  height: 100px;
}
.box-type-login .box .box-body {
  width: 500px;
  height: 275px;
  -webkit-animation: fadeIn 1.2s ease-in;
  -moz-animation: fadeIn 1.2s ease-in;
  -ms-animation: fadeIn 1.2s ease-in;
  -o-animation: fadeIn 1.2s ease-in;
  animation: fadeIn 1.2s ease-in;
}
.box-type-login .box .box-footer {
  position: absolute;
  margin: auto;
  left: 0;
  right: 0;
  bottom: -425px;
  top: 0;
  height: 100px;
}

.site-stats {
	margin: 0;
	padding: 0; text-align:center;
	list-style: none;
}
.site-stats li {
	cursor: pointer; display:inline-block;
	margin: 0 5px 10px; text-align:center; width:20%;
	padding:10px 0; color:#fff;
	position: relative;
}
.site-stats li i{ font-size:24px; clear:both}
.site-stats li:hover { background:none;
}

.site-stats li i {
	vertical-align: baseline;
}
.site-stats li strong {
	font-weight: bold;
	font-size: 20px; width:100%; float:left;
	margin-left:0px;
}
.site-stats li small {
	margin-left:0px;
	font-size: 11px;
	width:100%; float:left;
}
#wizardbox {    width: 80%;    margin-left: auto;    margin-right: auto;    position: relative;}
.instruction-list {
    padding:0px;
    margin:0px;
}
.instruction-list li {
    margin: 0px;
    line-height: 16px;
    text-align: justify;
    padding: 0px 0px 15px 20px;
    background: url('../Images/list-arrow.png') no-repeat left 2px;
    clear: none;
    height: auto;
    font: lighter 12px 'Open Sans',sans-serif;
}
.instruction-list li:first-child {
    margin: 0px;
    background:none;
    text-align:justify;
    display: inline-block;
    padding: 5px 0px 5px 0px;
    text-decoration: underline;
    font: lighter 18px 'Open Sans',sans-serif;
}
.instruction-list li:last-child {
    border-bottom:1px solid #f2f2f2;
}

/******************************************************* LOGIN HEADER ************************************************************/
.login-header
{
    width:100%;
    height:auto; 
    float:left;
    background:#efdfaf;
    text-align:center;
    padding:30px 0px;
}

.login-wrapper
{
    width:100%;
    float:left;

}

.login-body
{
    background-image:url(../CSS/login-bg.jpg);
    background-size:cover;
}


.login-wrap
{
    max-width:585px;
    width:100%;
    height:auto;
    margin:50px auto 0px auto;
}


.login-head
{
    width:100%;
    padding:10px 0px;
    text-align:center;
    font-family:'Segoe UI';
    font-weight:bold;
    font-size:32px;
    color:#FFFFFF;
    line-height:40px;
}


.login-box
{
    width:100%;
    margin-top:20px;
    background-color:rgba(255,255,255,0.2);
    text-align:center;
    padding:40px 0px;
    position:relative;
  
}

/*#UserName
{
    width:50%;
    height:30px;
    

}*/

/*#Password
{
    width:50%;
    height:30px;
   
}*/

.login-btn
{
    display:block;
    background:#efdda7;
    font-family:'Segoe UI';
    font-weight:bold;
    font-size:16px;
    color:#333333;
    border:1px solid #FFFFFF;
    padding:5px 30px;
    margin:20px auto;
}

form
{
    margin:0px !important;
}

.icon_username
{
    width:39px !important;
    height:38px !important;
    position:absolute;
    background:url('icon-username.png') no-repeat #9b2e33 center;
    left:119px;
    border:1px solid #FFFFFF;
}

.icon_password
{
    width:39px !important;
    height:38px !important;
    position:absolute;
    background:url('icon-password.png') no-repeat #9b2e33 center;
    left:119px;
    border:1px solid #FFFFFF;
}


@media screen and (-webkit-min-device-pixel-ratio:0) {
.icon_password  { margin-top:50px; }
    .icon_username {
        left: 118px;
    }
}


@media (max-width:600px)
{
    .icon_username
    {
        display:none;
    }

    .icon_password
    {
        display:none;
    }

    #UserName
    {
        padding-left:5px;
    }

    #Password
    {
        padding-left:5px;
    }

    .login-box
    {
        width:85%;
        margin:0px auto;
    }

    .login-head
    {
        font-size:24px;
        width:85%;
        margin:0px auto;
    }
} 