.login-overlay * {box-sizing: border-box; }
.vertical-align-middle {left: 16px; right: 16px;}
.login-overlay {background: rgba(0,0,0,.57); z-index: 22222; position: fixed; width: 100%; top: 0; height: 100%; display: none;}
.login-container { max-width: 400px; calc(100% - 20px);}
.login-middle-section {background: #fff;}
.ba-logo{padding: 16px 8px; position: relative; border-bottom: 4px solid #ffdd00; }
.ba-logo img {width: 65%; display: inline-block;}
.ba-logo i {width: 40px; line-height: 40px; right: 0; top: 0; position: absolute; cursor: pointer;}
.login-form-holder { background: #EFEFEF; }
.login-form-holder > div,
.login-form-area {padding: 8px 8px 16px; }
.login-form-area .joinNowFormEmaill > li{padding-bottom: 16px;}
.login-form-area .joinNowFormEmaill > li:nth-child(2){padding-bottom: 12px;}
.gender-field {padding-bottom: 8px !important;}
.login-form-area .joinNowFormEmaill > li:first-child,
.login-form-area .joinNowFormEmaill > li:last-child {padding: 0;}
li.pass-field { padding: 8px 0 16px; }
#forgotPassword {font-size: 12px;}
.login-form-area a.bg-grey {display: block;text-decoration: none;font-size: 14px;}
.separator {position: relative; padding: 0; margin: 7px 0;}
.separator:before {content: ''; position: absolute;  width: 100%; background: #000; height: 1px; top: 11px; left: 0;}
.separator span {background: #EFEFEF; position: relative; display: inline-block; padding: 0 10px; font-size: 16px; color: #000}
.facebook span.pslogin-button-auto,
span.pslogin-button-auto.facebook { background-color: #3A5A9B; font-size: 14px; line-height: 45px; display: block; text-align: center}
.pslogin-button-link {position: relative; text-transform: uppercase; display: block}
.pslogin-button-link, .pslogin-button-link:hover{color: #fff;}
.pslogin-button-link:after {content: "\f09a"; position: absolute; left: 14px; top: 9px; color: #fff; font:normal 30px/1 FontAwesome}
.pslogin-block .pslogin-buttons ul li .pslogin-button-icon, #new-password-form {display: none;}
.fake-fb { color: #000; text-transform: none; font-size: 11px; text-align: center; }
.fake-fb:hover { color: #000; }
.fake-fb::after { display: none; }
.login-terms-cookies { padding: 10px 0 14px 0; font-size: 11px; line-height: 13px;}
.login-form-holder a.btn-gray{display: block}
.featured-in {padding: 8px; }
.featured-in h5 {font-size: 14px; clear: both; margin: 0;}
.login-review {background: #EFEFEF; padding: 20px 24px 25px;}
.login-review img, .login-review a, .login-review span {display: inline-block; vertical-align: middle; z-index: 1; position: relative;}
.login-review a {font-size: 16px;}
.login-review img, .login-review span {margin-right: 20px;}
.login-review span{font-size: 21px;}
.validation-advice {margin-bottom: 5px;}
.pslogin-block.pslogin-register {margin-top: 7px;}
#thankyou-message .why-join {padding: 16px 0}
.ba-message h2 { background: #efefef; margin: 0; font-size: 16px; padding: 16px 0 4px; }
.why-join h3 {font-size: 16px; padding: 16px 0 8px 0; }
.why-join ul { calc(100% - 8px); margin: 0 auto 16px; text-align: left; }
.why-join li { display: block; padding: 0 0 0 8px; font-size: 12.5px;}
.why-join li i { position: relative; bottom: 2px; padding: 8px 8px 0 0; font-size: 12px; }
.join-now-top { overflow: hidden; position: relative; padding: 8px; border-bottom: 4px solid #ffdd00; }
.login-form-area input[type="radio"], .login-form-area input[type="checkbox"] {display: none;}
.login-form-area input[type="radio"] + label {font-size: 16px; line-height: 24px;}
.login-form-area input[type="checkbox"] + label {font-size: 11px;}
.login-form-area input[type="radio"] + label, .login-form-area input[type="checkbox"] + label {padding: 0 0 0 37px; cursor: pointer; position: relative; margin: 0; display: inline-block; vertical-align: top;}
.login-form-area input[type="radio"] + label:after, .login-form-area input[type="checkbox"] + label:after {background: #fff; width: 24px; height: 24px; position: absolute; left: 0; top: 0; content: ''; border: 1px solid #95989A; text-align: center}
.login-form-area input[type="radio"]:first-child + label {margin-right: 70px}
.login-form-area input[type="radio"]:checked + label:after, .login-form-area input[type="checkbox"]:checked + label:after { font:normal normal normal 20px/24px FontAwesome; color:#000; content: "\f00c";}
#login-form-pop > ul > li:nth-child(2),
#new-password-form > ul > li:nth-child(2) { margin-top: 8px; }
.error, .validation-advice{font-size: 11px; background: #c2c2c2; padding: 10px 20px; font-weight: normal; float: left; margin-bottom: 15px;}
.error span {float: left; padding-left: 30px; position: relative;}
.validation-advice{ margin-top: 10px; position: relative; padding-left: 55px;}
.error span:before, .validation-advice:before{content: '\f071'; font:normal normal normal 18px FontAwesome; color: #ee001c; position: absolute; left: 0; top: 50%; transform: translateY(-40%)}
.validation-advice:before {left: 20px; top: 15px;}
.subscription-box {margin-top: 16px;}
.login-terms-cookies a{text-decoration: underline}
.thank-you--image { position: absolute; top: -55px; width: 100%; text-align: center; left: 100%; }
#forgotPassword { line-height: 32px; }
.signUpTrigger { margin-bottom: 8px; }

.step3 {}
.step3 h4 { text-align: center; }
.step3 p,
.step3 button { margin-bottom: 8px; }
.step3 ul { padding-bottom: 12px; }
.step3 li { padding: 4px 4px 0 4px!important; }

.step-fb { display: none; }

@media only screen and (max-width: 767px) {
    .login-container {margin: 20% auto; overflow: auto; -webkit-overflow-scrolling: touch;overflow-y: auto}
    #thankyou-message .login-form-area{display: none;}
    .login-overlay {position: fixed !important; height: 100% !important; overflow: auto;}
    .no-scroll {overflow: hidden; position: fixed; width: 100%;}
    .ba-logo {padding: 8px;}
    .not-a-member a {text-align: center;}
    #newLogin .login-form-area li:nth-child(2) {padding-bottom: 0;}
    .login-form-area li.text-right {padding: 0;}
    #forgotPassword {font-size: 13px; display: block}
    .pslogin-block .pslogin-buttons ul li .pslogin-button-text, #forgotPassword, .login-overlay button, .login-overlay input, a.btn-gray{line-height: 48px;}
    .featured-in {padding: 10px 20px 15px;}
    .featured-in img{margin-bottom: 18px;}
    .featured-in h5 {padding: 0; line-height: 20px; font-size: 16px;}
    .login-review {padding: 25px 90px 25px 0; text-align: center; background:#d8d8d9; overflow: hidden; position: relative;}
    .login-review img:last-child { position: absolute; top: 14px; width: 65%;  border: none; right: -10px; z-index: 0;}
    .login-review span {padding-bottom: 15px; display:block; font-size: 23px;}
    .login-review img, .login-review span {margin-right: 0;}
    .login-review img {margin-bottom: 15px;}
    #signup-popup-show .login-image, #thankyou-message .login-image {display: block}
    #thankyou-message .shop-now {margin: 12px 20px 0 20px; width: auto; display: block;}
    .login-form-area input[type="radio"]:first-child + label{margin: 0 4.5% 0 0;}
    .login-form-area input[type="radio"] + label {background: #fff; border: 1px solid #C2C2C2; line-height: 48px; width: 47%; padding-left: 50px;}
    .login-form-area input[type="radio"] + label:after {top: 12px; left: 12px;}
    .login-overlay .half-length {width: 100% !important}
    .why-join h3 { padding: 8px 0 0; }
}

@media only screen and (min-width: 768px) {
    .login-container { margin:0 auto; position: relative; margin-top: 5%;}
    .p-left { float: left}
    .p-right { float: right}
}


.step2 .separator { border: none; display: block!important;}
.joke-of-a-button { font-size: 11px; line-height: 12px!important; font-weight: normal!important; border: 0; background: none; margin: 8px 0 24px; }

.step3 .joke-of-a-button { margin-bottom: 0; margin-top: 8px;  }

.gender-field #advice-validate-one-gender-signupMale { display: none;}



/*work for MA-4007 start*/
.login-container .trustpilot-widget .trustscore {
    padding-top: 5px;
    height: 100%;
}

.login-container .join-now-top a {
    padding: 0;
}

.login-container .forgot-password a {
    text-decoration: none;
}

@media only screen and (max-width: 340px) {
    .why-join li {
        font-size: 11.2px;
    }
}

.not-a-member {
    background: #000;
    text-align: right;
    padding-right: 12px;
}
.not-a-member a{
    color: #fff;
    font-size: 13px;
    font-weight: 400;
    text-decoration: underline;
}

.join-now-top img {
    display: none;
}
/*work for MA-4007 end*/


.trustpilot-message .trustpilot-widget {
    pointer-events: none;
}


.trustpilot-message  #tp-wrapper {
    font-family: "Segoe UI","Helvetica Neue","Helvetica","Arial","sans-serif";
    margin: 0 auto;
    width: 100%;
    text-align: center;
}

.trustpilot-message  .tp-score-star .trustscore {

    font-weight: 500;
    margin-left: 5px;
}



.trustpilot-message .tp-score-star,
.trustpilot-message .reviews-info {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    box-sizing: border-box;
    align-content: space-between;
    -webkit-align-content: space-between;
    -webkit-align-items: center;
    align-items: center;
    flex-flow: row;
    -webkit-flex-flow: row;
    font-size: 100%;
    justify-content: center;
    -webkit-justify-content: center;
}



.trustpilot-message #tp-stars {
    width: 50%;
    margin-left: 18px;
    max-width: 110px;
}


.trustpilot-message #tp-logo {
    width: 35%;
    margin-left: 5px;
    max-width: 90px;
}

.trustpilot-message #tp-reviews,.trustpilot-message span {
    font-size: 14px;
    padding-bottom: 0;
}

.trustpilot-message .tp-star__canvas {
    fill: #00b67a;
}

.trustpilot-message svg {
    max-height: 20px;
}

.acba-message h3 {
    font-size: 14px;
    font-weight: 600;
}

.chester-message h3 { background: #efefef; margin: 0; font-size: 14px; padding: 6px 0 14px; }

.ba-logo .achica-logo,
.ba-logo .chester-logo,
.ba-logo .cocosa-logo,
.ba-logo .and-con {
    display: none;
    max-height: 60px;
}

.ba-logos {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
}

.ba-logos img {
    width: 48%;
    padding: 10px;
    object-fit: cover;
}

.ba-logo.ba-logos .and-con {
    display: inline-block;
}


.ba-logos .show-logo {
    display: inline-block;
}


.login-form-holder .why-join {
    text-align: center;
    padding-bottom: 8px;
    font-weight: 700;
}

.login-form-holder .why-join h2 {
    font-size: 18px;

}

.joinNowFormPass li.why-join h2 {
    font-size: 16px;
    font-weight: 600;
}

.joinNowFormPass li.why-join p {
    font-size: 13px;
}


.ba-message.welcome-msg h2 {
    background: #ffdd00;
    padding: 8px;
    line-height: 16px;
    padding-bottom: 10px;
}

a.underline {
    text-decoration: underline;
}