﻿/**
 * Login layout with view content styles
 */

.wrapper { width: 100%; min-width: 330px; }
.wrapper-center { width: 330px; margin: 0 auto; padding: 50px 0 20px 0; }
.wrapper-center.dealerSelectionContainer {width: 420px} 
#logo-container { height: 150px; background-color: #fff; -moz-border-top-left-radius: 5px; -webkit-border-top-left-radius: 5px; -o-border-top-left-radius: 5px; border-top-left-radius: 5px; -moz-border-top-right-radius: 5px; -webkit-border-top-right-radius: 5px; -o-border-top-right-radius: 5px; border-top-right-radius: 5px; -moz-box-shadow: 0px 1px 3px #bbb; /* Firefox */ -webkit-box-shadow: 0px 1px 3px #bbb; /* Safari, Chrome */ box-shadow: 0px 1px 3px #bbb; /* CSS3 */ position: relative; top: 0px; left: 0px; }
#logo-container .logo { width: 250px; height: 96px; margin: 0 auto; padding: 23px 0 0 0; }
#logo-container .logo h1 { background: url('../images/login-layout-logo.png'); width: 250px; height: 96px; display: block; overflow: hidden; }
#logo-container .logo h1 a { width: 250px; height: 96px; display: block; text-indent: -99999px; }

#view-container .big-top-padd { padding-top: 80px; }
#view-container .app-foot { padding: 5px 0 0 0; color: #404040; text-align: center; }
#view-container label { display: block; color: #404040; font-size: 14px; line-height: 14px; /*text-align: center;*/ font-weight: bold; padding: 15px 0px 10px; width: 300px; }
#view-container input { width: 100%; background-color: #f6f6f6; -moz-box-shadow: inset 1px 1px 1px #ddd; /* Firefox */ -webkit-box-shadow: inset 1px 1px 1px #ddd; /* Safari, Chrome */ box-shadow: inset 1px 1px 1px #ddd; /* CSS3 */ padding: 14px; display: block; height: auto; font-size: 14px; line-height: 16px; }
#view-container input:hover { background-color: #f3f3f3; }
#view-container h2 { text-align: center; }
#view-container .form-padd { padding: 5px 45px 25px 45px; }
#view-container .form-buttons { padding: 20px 0 10px 0; }
#view-container .login-fields { padding: 55px 0 15px 0; }
#view-container .login-form-fields { padding: 23px 0 15px 0; }
#view-container .login-button { padding: 0 0 15px 0; }
#view-container .login-button button { display: block; width: 100%; font-size: 20px; line-height: 20px; padding: 10px 0; }
#view-container .login-forgotten { text-align: center; }
#view-container .login-forgotten a { font-weight: bold; color: #404040; }

#view-container .login-field { padding: 0 0 10px 0; position: relative; }
#view-container .login-field input { padding-left: 50px; }
#view-container .login-field input[name="DealerCode_input"],
#view-container .login-field input[name="DealerName_input"] { padding-left: 10px; box-sizing: border-box}
#view-container .login-field .k-state-default .k-select {height: 100% !important}
#view-container .login-field .k-combobox .k-icon {margin-top: 14px}
#view-container .login-field span.login-field-icon { display: block; width: 39px; height: 45px; position: absolute; top: 0px; left: 0px; z-index: 100; background-position: left top; background-repeat: no-repeat; }
#view-container .login-field span.login-field-icon.user { background-image: url('../images/login-input-user.png'); }
#view-container .login-field span.login-field-icon.password { background-image: url('../images/login-input-pass.png'); }
#view-container .k-dropdown-wrap.k-state-default:before {display: none}

#view-container .body-box { -moz-box-shadow: 0px 0px 2px #bbb; -webkit-box-shadow: 0px 0px 2px #bbb; box-shadow: 0px 0px 2px #bbb; }


#view-container .form-label { float: none; padding: 0 0 0 0; min-width: 0; max-width: none; width: 100% !important}
#view-container .form-field-cont { float: none; padding: 0 0 0 0; position: relative; top: 0px; left: 0px; }
#view-container .form-field-cont .form-field { float: none; min-width: 0; }
#view-container .form-field-cont .form-field-validation { float: none; padding: 0 0 0 0; position: absolute; top: 23px; right: -4px; }

#view-container .form-field label { width:37%; display:inline-block; text-align:left } 
#view-container .form-field label + .k-widget { width:60%; display:inline-block; }
