.splash {background-color: rgb(33,33,33); background-color: rgba(33,33,33,.7); } 

.pop-wrapper-thankyou {position: relative; padding-top: 277px; padding-left: 135px; text-align: center; } 
.sbmt-btn {background: transparent url('../images/preference-center/btn.jpg') no-repeat center center; border: none; width: 450px; height: 57px; margin: 10px 0; } 

.inputs:focus {outline-color: #54B4AD; } 
.inputs-zip {width:276px; } 
.inputs-text {width:276px; } 
.inputs-email {width:255px; }
/* #CoverPop-cover { z-index: 2000; } // CoverPop removed - legacy popup functionality */ 
input:focus,textarea:focus, .form-control:focus { outline: none !important; } 
input.error, textarea.error{ border:2px solid #c50a0a !important; border-radius: 5px; } 
.popup-thank-you { display: none; position: relative; top: 120px; left: 0px; right: 0px; bottom: 0px; z-index: 1000; font-family: 'Times New Roman'; font-size: 22px !important; text-shadow: 1px 1px 2px rgba(0, 0, 0, 1); color: #fff; } 
.newsletter-dropdown-thanks {padding-left: 435px; padding-top: 130px; color: #fff; font-size: 25px; line-height: 24px; display: none; width:800px; font-family: "Times New Roman"; } 
p.required-feilds { margin-bottom: -10px; margin-left: -175px; color:#fff; }



@media (min-width: 768px) 
{
    .splash-center {text-align: left; width: 761px; height: 644px; background: transparent url('../images/preference-center/pop-up-bg-old.png') no-repeat center center; margin: 120px auto 0px; background-size: 99%; } 
    .splash-center-thank-you {text-align: left; width: 787px; height: 633px; background: transparent url('../images/preference-center/berio_bg_thank_you.png') no-repeat center center; margin: 0px auto 0px; background-size: 99%; } 
    .close-btn {position: absolute; top: 95px;
    right: 18px; cursor: pointer; } 
    .thank-you-close-btn {position: absolute;     top: 84px;  right: 16px; cursor: pointer; } 
    .pop-up-text p {color:#fff; font-size: 14px; padding: 0 144px; font-family: 'Raleway', sans-serif; } 
    .pop-up-text p a {color:#fff; font-size: 14px; font-family: 'Raleway', sans-serif; text-decoration:underline; } 
    .pop-up-text-thankyou p {color:#fff; font-size: 14px; padding: 0 114px; font-family: 'Raleway', sans-serif; } 
    .pop-wrapper {  position: relative;    padding-top: 199px;    padding-left: 135px;    text-align: center; }
    .inputs {padding: 5px; margin: 5px 5px; border-radius: 5px; border: 2px solid #fff; background-image: none; } 

    .popup-thank-you { margin: 120px auto 0px; top: 0px; width: 761px; }
    .splash-center-thank-you { padding-top: 199px; padding-left: 135px; position: relative; }
    .user-launched-exists, .user-launched-error, .user-launched-success, .pop-wrapper-exists, .pop-wrapper-error, .pop-wrapper-success { padding: 90px 160px 0px 100px; font-size: 20px; text-align: center; }
}         
@media (min-width: 1024px) 
{
    .splash-center {text-align: left; width: 932px; height: 629px; background: transparent url('../images/preference-center/pop-up-bg.png') no-repeat center center; margin: 120px auto 0px; } 
    .splash-center-thank-you {text-align: left; width: 932px; height: 629px; background: transparent url('../images/preference-center/berio_bg_thank_you.png') no-repeat center center; margin: 0 auto; } 
    .close-btn {position: absolute; top: 77px;
    right: 52px;  cursor: pointer; } 
    .pop-up-text p {color:#fff; font-size: 14px; padding: 0 233px; font-family: 'Raleway', sans-serif; } 
    .pop-up-text-thankyou p {color:#fff; font-size: 14px; padding: 0 188px; font-family: 'Raleway', sans-serif; } 
    .thank-you-close-btn {position: absolute; top: 77px;
    right: 52px; cursor: pointer; } 
    .pop-wrapper {position: relative; padding-top: 181px; padding-left: 135px; text-align: center; } 
    .inputs { padding: 8px; margin: 5px 5px; border-radius: 5px; border: 2px solid #fff; background-image: none; } 

    .popup-thank-you { width: 932px; }
    .splash-center-thank-you { padding: 280px 0px 0px 90px; }
    .user-launched-exists, .user-launched-error, .user-launched-success, .pop-wrapper-exists, .pop-wrapper-error, .pop-wrapper-success { padding: 10px 200px 0px 235px; font-size: 22px; }
}

/* placed here to override media queries */
.splash-center { background-image: url('../images/preference-center/pref-pop-default.png'); background-position: 69% 38%;}
.splash-center-thank-you { background-image: url('../images/preference-center/pref-pop-thanks.png'); background-position: 69% 38%;}

.splash-center p.close-splash img.close-btn,
.popup-thank-you p.close-splash img.thank-you-close-btn {
    top: 0px;
    right: 0px;
}

/** override styles with better ones **/
/* to close on mobile, try $("#preference-center").triggerHandler('click') on resize under 768 */
@media(min-width:768px) {
    .splash-center, .popup-thank-you { display: block; width: 100%; margin: 120px auto 0; padding: 0px; background: transparent no-repeat top left; background-size: 740px; max-width: 740px; max-height: 517.82px; }
    .popup-thank-you { display: none; } /* for js to toggle */
    .splash-center { background-image: url('/wp-content/themes/berio2025/images/preference-center/pref-pop-default.png'); }
    .popup-thank-you { background-image: url('/wp-content/themes/berio2025/images/preference-center/pref-pop-thanks.png'); }
    .splash-center > .pop-wrapper, .popup-thank-you > .splash-center-thank-you { background: transparent; padding: 69.88px 34.94px 72.57px 108.40px; margin: 0px; width: 596.66px; height: 375.37px; box-sizing: content-box; position: relative; }
    p.close-splash { position: absolute; top: 51.96px; right: 17.02px; }
    p.close-splash .close-btn { top: 0px; right: 0px; cursor: pointer; position: relative; display: block; }
    .popup-thank-you p.close-splash { top: -26px; right: 3px; }
    .popup-thank-you p.close-splash img {top: 93px; right: 24px; }
    .pop-up-text p { padding: 80px 120px 0; font-size: 0.85em; }
    .pop-up-text p a { font-size: 1em; }
    p.required-feilds { margin-left: 0px; font-size: 0.9em; }
    #issub_header { font-size: 0.9em; line-height: 0.7em; }
    .user-launched-exists, .pop-wrapper-exists { padding: 155px 90px 1px; font-size: 0.75em; }
    .user-launched-error, .user-launched-success, .pop-wrapper-error, .pop-wrapper-success { padding: 175px 90px 1px; font-size: 0.85em; }
    .user-launched-exists br, .user-launched-error br, .user-launched-success br, .pop-wrapper-exists br, .pop-wrapper-error br, .pop-wrapper-success br { display: none; }
    .popup-thank-you p.close-splash { top: -43px; right: -8px; }

    #modal_coupon_success p.close-coupon {
        top: -7px;
        right: 58px;
    }
    #modal_coupon_success p.close-coupon img.close-btn {
        top: 0px;
        right: 0px;
    }
    .splash-center p.close-splash, 
    .popup-thank-you p.close-splash {
        top: 51px;
        right: 15px;
    }
    .splash-center p.close-splash img.close-btn,
    .popup-thank-you p.close-splash img.thank-you-close-btn {
        top: 0px;
        right: 0px;
    }
}
@media(min-width:826px) {
    .splash-center, .popup-thank-you { background-size: 826px; max-width: 826px; max-height: 578px; }
    .splash-center > .pop-wrapper, .popup-thank-you > .splash-center-thank-you { padding: 78px 39px 81px 121px; width: 666px; height: 419px; }
    .popup-thank-you p.close-splash { top: -26px; right: 3px; }
    p.close-splash .close-btn { }
    .pop-up-text p { padding: 95px 120px 0; font-size: 1.0em; }
    p.required-feilds { font-size: 1.0em; }
    #issub_header { font-size: 1.0em; line-height: inherit; }
    .user-launched-exists, .pop-wrapper-exists { padding: 190px 90px 1px; font-size: 0.85em; }
    .user-launched-error, .user-launched-success, .pop-wrapper-error, .pop-wrapper-success { padding: 190px 150px 1px; font-size: 0.85em; }
    
    .splash-center p.close-splash, 
    .popup-thank-you p.close-splash {
        top: 58px;
        right: 19px;
    }
    .splash-center p.close-splash img.close-btn,
    .popup-thank-you p.close-splash img.thank-you-close-btn {
        top: 0px;
        right: 0px;
    }
}
@media(min-width:1024px) {
    .splash-center .inputs { padding: 5px; }
    .popup-thank-you p.close-splash img {
        top: 84px;
        right: 16px;
    }
    .splash-center p.close-splash img.close-btn ,
    .popup-thank-you p.close-splash img.thank-you-close-btn {
        top: 0px;
        right: 0px;
    }
}