@charset "utf-8";
/* CSS Document */
body{margin:0px; padding:0px; font-family:Arial, Helvetica, sans-serif; font-size:12px; color:12px; background:#e3e3e3}
p{padding:0; margin:0}
/* ---  Header --- */
.header{}
/* ---  Header --- */
/* ---  Header --- */
/* ---  Login Page --- */
.wrapperLogin{width:700px; margin:0 auto; margin-top:70px; min-height:410px}
.logosLogin {margin-bottom:10px; height:85px}
.logosLogin ul{list-style:none; margin:0; padding:0}
.logosLogin ul li{margin:0; padding:0; float:left}
.mainLogo{width:350px; text-align:left; float:left}
.subLogo{//width:350px;
       // background:url(../images/wfm.png) no-repeat right bottom; 
        //height:80px
}


.loginBox {padding:10px; min-height:260px; width:680px; border:1px solid #b8b8b8; border-radius:5px; background:#fff;clear:both;}
.loginFooter{width:700px; line-height:25px; color:#666666; font-size:11px; padding-top:5px;}
.copyRight{
    //background: url(../images/wfs-small-logo.png) no-repeat left;
    //padding: 30px 35px; 
}
.version{float:right}

.userName{
 width: 280px;
margin-right: 10px;
float: left;
margin-left: 60px;
margin-top: 65px;
}
.userName p{font-size:14px; font-weight:bold; padding:0; margin:5px 0px}
.passWord{width:330px; float:left;margin-top:65px}
.passWord p{font-size:14px; font-weight:bold; padding:0; margin:5px 0px}
.customerId{width:280px; margin-right:10px; float:left; margin-left:60px; margin-top:0px}
.customerId p{font-size:14px; font-weight:bold; padding:0; margin:5px 0px}

/***** buttons *****/
.btn {
    padding: 7px 20px 9px 20px;
    font-size: 14px;
    letter-spacing: normal;
    cursor:pointer;
    color: #d7d7d7;
    border: solid 1px #333;
    background: #333;
    background: -webkit-gradient(linear, left top, left bottom, from(#666), to(#000));
    background: -moz-linear-gradient(top,  #666,  #000);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#666666', endColorstr='#000000');
    -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.3), inset 0 0 0 1px rgba(255,255,255,0.1), 0 1px 0 rgba(255,255,255,.7);
    -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,0.3), inset 0 0 0 1px rgba(255,255,255,0.1), 0 1px 0 rgba(255,255,255,.7);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.3), inset 0 0 0 1px rgba(255,255,255,0.1), 0 1px 0 rgba(255,255,255,.7);
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-transition: all 0.4s linear;
    -moz-transition: all 0.4s linear;
    -o-transition: all 0.4s linear;
    transition: all 0.4s linear;
}
.btn:hover {
    background: #000;
    background: -webkit-gradient(linear, left top, left bottom, from(#444), to(#000));
    background: -moz-linear-gradient(top,  #444,  #000);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#444444', endColorstr='#000000');
    -webkit-box-shadow: inset 0 1px 0 rgba(25, 63, 63, 0.15), 0 1px 0 rgba(255, 255, 255, 0.8), 0 0 11px rgba(25, 63, 63, 0.55);
    -moz-box-shadow: inset 0 1px 0 rgba(25, 63, 63, 0.15), 0 1px 0 rgba(255, 255, 255, 0.8), 0 0 11px rgba(25, 63, 63, 0.55);
    box-shadow: inset 0 1px 0 rgba(25, 63, 63, 0.15), 0 1px 0 rgba(255, 255, 255, 0.8), 0 0 11px rgba(25, 63, 63, 0.55);


}
.btn:active { background-color: #d4d8db; }

.input-username {
    display: block;
    font-size: 1.15em;
    color: #666;
    background: #fff url(../images/username.png) no-repeat left;
    width: 225px;
    padding: 8px 11px 8px 44px;
    margin-bottom: 15px;
    border: 1px solid #b8b8b8;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 0 rgba(34, 25, 25, 0.15), 0 1px 0 #fff;
    -moz-box-shadow: inset 0 1px 0 rgba(34, 25, 25, 0.15), 0 1px 0 #fff;
    box-shadow: inset 0 1px 0 rgba(34, 25, 25, 0.15), 0 1px 0 #fff;
    -webkit-transition: all 0.4s linear;
    -moz-transition: all 0.4s linear;
    -o-transition: all 0.4s linear;
    transition: all 0.4s linear;
}

.input-password {
    display: block;
    font-size: 1.15em;
    color: #666;
    background: #fff url(../images/password.png) no-repeat left;
    width: 225px;
    padding: 8px 11px 8px 44px;
    margin-bottom: 15px;
    border: 1px solid #b8b8b8;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 0 rgba(34, 25, 25, 0.15), 0 1px 0 #fff;
    -moz-box-shadow: inset 0 1px 0 rgba(34, 25, 25, 0.15), 0 1px 0 #fff;
    box-shadow: inset 0 1px 0 rgba(34, 25, 25, 0.15), 0 1px 0 #fff;
    -webkit-transition: all 0.4s linear;
    -moz-transition: all 0.4s linear;
    -o-transition: all 0.4s linear;
    transition: all 0.4s linear;
}

/* input focus selection */
.input-username:focus{
    background: #fff url(../images/username.png) no-repeat left;
    color: #000;
    border-color: #4b8bff;
    -webkit-box-shadow: inset 0 1px 0 rgba(34, 25, 25, 0.15), 0 1px 0 rgba(255, 255, 255, 0.8), 0 0 11px rgba(96, 96, 235, 0.55);
    -moz-box-shadow: inset 0 1px 0 rgba(34, 25, 25, 0.15), 0 1px 0 rgba(255, 255, 255, 0.8), 0 0 11px rgba(96, 96, 235, 0.55);
    box-shadow: inset 0 1px 0 rgba(34, 25, 25, 0.15), 0 1px 0 rgba(255, 255, 255, 0.8), 0 0 11px rgba(96, 96, 235, 0.55);
}

.input-password:focus{
    background: #fff url(../images/password.png) no-repeat left;
    color: #000;
    border-color: #4b8bff;
    -webkit-box-shadow: inset 0 1px 0 rgba(34, 25, 25, 0.15), 0 1px 0 rgba(255, 255, 255, 0.8), 0 0 11px rgba(96, 96, 235, 0.55);
    -moz-box-shadow: inset 0 1px 0 rgba(34, 25, 25, 0.15), 0 1px 0 rgba(255, 255, 255, 0.8), 0 0 11px rgba(96, 96, 235, 0.55);
    box-shadow: inset 0 1px 0 rgba(34, 25, 25, 0.15), 0 1px 0 rgba(255, 255, 255, 0.8), 0 0 11px rgba(96, 96, 235, 0.55);
}
.link-red{color:#ee1c25; padding:0; font-style:italic; font-size:12px; text-decoration:underline;}
.link-red:hover{color:#ee1c25; padding:0; font-style:italic; font-size:12px; text-decoration:none}

.checkRemember{width:190px; float:left; line-height:12px}

/* custom checkboxes */
/* original code solution http://kubyshkin.ru/web/cross-browser-css3-image-free-custom-checkbox/ */
.custom-checkbox {
    position: relative;
    display: inline-block;
    width: 169px;
    zoom: 1;
    margin-top:10px
}

.custom-checkbox label { display: block;  position: absolute; top: 2px; left: 25px; }

.custom-checkbox > .box {
    position: relative;
    display: block;
    margin-bottom: 8px;
    width: 14px;
    height: 14px;
    border: 1px solid #ccc;
    background-color: #eee;
    border-radius: 4px;
}

.custom-checkbox > .box > .tick {
    position: absolute;
    left: 2px;
    top: -2px;
    width: 14px;
    height: 6px;
    border-bottom: 2px solid #454545;
    border-left: 2px solid #454545;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.7071067811865476, M12=0.7071067811865475, M21=-0.7071067811865475, M22=0.7071067811865476, sizingMethod='auto expand');
    display: none;
    zoom: 1;
}
.custom-checkbox > input:checked + .box > .tick {
    display: block;
}

.custom-checkbox > input {
    position: absolute;
    outline: none;
    left: 0;
    top: 0;
    padding: 0;
    width: 16px;
    height: 16px;
    border: none;
    margin: 0;
    opacity: 0;
    z-index: 1;
}
.custom-checkbox > input:active + .box {
    border-color: #aaa;
    background-color: #ddd;
}

.dash-board-listmenu{width:150px; padding:6px; font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#000; border:1px solid #acacac; 	background: -webkit-linear-gradient(top, #e9e9e9, #ffffff); background: -moz-linear-gradient(bottom, #e9e9e9, #ffffff);  background: -ms-linear-gradient(bottom, #e9e9e9, #ffffff);
                     background: -o-linear-gradient(top, #bottom, #ffffff); border-radius:3px;}