.main-content.login,
.main-content.registration {margin-top: 40px; margin-bottom: 30px;}

.entry-main .content {margin-left: auto !important; margin-right: auto !important;}
.entry-main input[type=text], .entry-main input[type=password], .entry-main select, .entry-main textarea {width: 100%; height: 38px; background: #FFFFFF; border: 1px solid #E0E0E0; padding: 0 12px; margin: 0; outline: 0; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;}
.entry-main input[type=text]:focus, .entry-main input[type=password]:focus, .entry-main select:focus, .entry-main textarea:focus {box-shadow: 0 0 5px #DDDDDD;}
.entry-main textarea {padding: 12px 12px !important;}
.entry-main input[type=submit] {margin: 15px 0 0 0; outline: 0;}
.entry-main select {width: 100%; height: 36px; padding: 0 6px;}
.entry-main select::-webkit-scrollbar {width: 6px;}
.entry-main select::-webkit-scrollbar-track {background: #EEEEEE;}
.entry-main select::-webkit-scrollbar-thumb {background: #CCCCCC;}
.entry-main input[type=checkbox],
.entry-main input[type=radio] {display: none;}
.entry-main input[type=checkbox]:checked + label:before,
.entry-main input[type=radio]:checked + label:before {content: "\2713"; font-size: 13px; font-weight: bold; color: #FFFFFF; background: #454545; border: 1px solid #454545; text-align: center; line-height: 18px;}
.entry-main label {display: inline-block; position: relative; padding: 1px 0 0 30px; margin: 0; cursor: pointer; -webkit-tap-highlight-color: transparent;}
.entry-main label#personal_account_label {margin: 0 40px 0 0;}
.entry-main label:before {content: ""; display: inline-block; position: absolute; top: 1px; left: 0; width: 18px; height: 18px; background: #FFFFFF; border: 1px solid #BBBBBB; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px;}

.reg-outer {display: block; width: 540px; color: var(--grey); background: #FFFFFF; text-align: left; margin: 0 auto 60px auto !important; padding: 35px 40px !important; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; border: 1px solid #e5e5e5; box-shadow: 0 1px 12px #E5E5E5;}
.reg-outer .error-message-box {background: #fdf2f2; color: var(--red2); font-size: 13px; margin-bottom: 25px; font-weight: bold; border: 1px solid var(--red); padding: 12px 18px; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;}
.reg-outer .field-error {display: block; color: var(--red2); font-size: 12px; font-weight: normal; line-height: 1.2; margin-top: 5px; margin-bottom: 5px;}
.reg-outer ul.registration {padding: 0; margin: 0;}
.reg-outer ul.registration li {display: inline-block; width: -webkit-calc(50% - 20px); width: -moz-calc(50% - 20px); width: calc(50% - 20px); vertical-align: top !important; margin: 0 0 12px 0; text-align: left;}
.reg-outer ul.registration li.odd {margin: 0 12px 12px 0;}
.reg-outer ul.registration li.even {margin: 0 0 12px 12px;}
.reg-outer ul.registration li.wide {width: -webkit-calc(100% - 12px); width: -moz-calc(100% - 12px); width: calc(100% - 12px); margin-right: 0;}
.reg-outer ul.registration li span {display: block; position: relative; left: 1px; padding: 0;}
.reg-outer ul.registration li div {margin: 4px 0 0 0;}
.reg-outer .company-box {display: none; margin: 0 0 27px 0;}
.reg-outer .billing-address-box {display: none; margin: 10px 0 12px 0;}
.reg-outer .use-billing-address-box label {margin: 12px 0 0 0;}
.reg-outer .use-billing-address-box label span {display: inline;}
.reg-outer .terms-and-conditions-box label {margin: 3px 0 0 0;}
.reg-outer .terms-and-conditions-box label span {display: inline;}

.reg-outer input.error,
.reg-outer select.error {border: 1px solid #d75350;}
.reg-outer select.is-empty {color: var(--grey4) !important;}
.reg-outer select option {color: var(--black4) !important;}
.reg-outer select option[value=""] {color: var(--grey4) !important;}

.login-outer {display: block; width: 380px; background: #FFFFFF; text-align: left; margin: 0 auto 60px auto !important; padding: 35px 40px !important; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; border: 1px solid #e5e5e5; box-shadow: 0 1px 12px #E5E5E5;}
.login-outer .error {color: #e03838; font-size: 12px; font-weight: bold; margin: 0 0 10px 1px;}
.login-outer .lost-password-box {display: flex; align-items: flex-start; gap: 22px; width: 100%; font-size: 14px; margin: 0 0 18px 0; padding: 0 0 18px 0; border-bottom: 1px solid #E5E5E5; box-sizing: border-box;}
.login-outer .lost-password-icon {flex: 0 0 60px; padding-top: 6px;}
.login-outer .lost-password-icon img {display: block; width: 60px; height: 60px;}
.login-outer .lost-password-content {flex: 1; min-width: 0; text-align: left;}
.login-outer .lost-password-box .title {display: block; color: var(--black4); font-weight: bold; margin: 0 0 4px 0;}
.login-outer .lost-password-box .text {display: block; color: var(--grey); margin: 0 0 4px 0;}
.login-outer ul.login {padding: 0; margin: 0;}
.login-outer ul.login li {display: inline-block; width: -webkit-calc(100% - 2px); width: -moz-calc(100% - 2px); width: calc(100% - 2px); margin: 0 0 15px 0; text-align: left;}
.login-outer ul.login li:last-child {margin: 0 0 5px 0;}
.login-outer input[type=text], .entry-main input[type=password] {height: 40px;}
.login-outer input[type=submit] {width: 100%; margin: 5px 0 0 0;}
.login-outer .remember-me-box label {margin: 2px 0 0 0; font-size: 12px;}
.login-outer .remember-me-box label span {display: inline; position: relative; top: -2px;}
.login-outer .links a {font-size: 13px; text-decoration: underline;}
.login-outer .links a:hover {text-decoration: underline;}
.login-outer .links a.lost-password {display: inline-block;}
.login-outer .links a.registration {display: inline-block; float: right;}
.login-outer .terms-and-conditions {text-align: center; font-size: 12px; color: #727272 !important; line-height: 18px; margin: 25px 0 0 0;}
.login-outer .terms-and-conditions a {display: inline; font-size: 11px; text-decoration: underline;}

@media only screen and (max-width: 920px)
{
  .main-content.login,
  .main-content.registration {margin-top: 0; margin-bottom: 60px;}

  .login-outer input[type=text], .login-outer input[type=password] {height: 42px;}
}

@media only screen and (max-width: 640px)
{
    .reg-outer {width: auto;}
    .reg-outer ul.registration li,
    .reg-outer ul.registration li.odd,
    .reg-outer ul.registration li.even,
    .reg-outer ul.registration li.wide {width: 100%; display: block; margin: 0 0 14px 0;}
    .reg-outer ul.error-message {display: block; width: -webkit-calc(100% - 30px); width: -moz-calc(100% - 30px); width: calc(100% - 30px);}
}

@media only screen and (max-width: 460px)
{
    .entry-main label#personal_account_label {margin: 0 40px 12px 0;}
    .login-outer {width: auto;}
}