/* GENERIC */
html, body { height: 100%; }
h2, h3, h4 { border-bottom: 0 none; color: #343434; padding-bottom: 0; }
h3 {
    border-bottom: 2px solid #e9e9e9;
    padding-bottom: 8px;
    margin:0 0 15px;
}
h2 { font-size: 1.5em; }
.left-container.half { margin-top: 20px; }
.right-container.half { margin-top: 20px; }
.secondary-button { background: #e9e9e9; }
h1 + p { margin-top: 20px; }
a.logo-container img.svg { height: 38px; width: 100%; }
a.logo-container img { max-width: 338px; width: 100%; max-height: 38px; }
.button-container {margin: 20px 0 0 0;}
/* LEFT HAND SIDE */
.wrap { position: relative; min-height: 100%; margin: 0 0 -55px 0; }
.image-bg, .video-container { padding: 0; float: left; left: 0; position: relative; text-align: center; top: 0; width: 37%; z-index:0; margin-top: 30px; height: 650px; }
.image-bg .rotator-entry:first-child { display: block; }
.image-bg .rotator-entry { position: absolute; right: 0; left:0; top:0; bottom:0; display: none; height: 650px; }
.image-bg .rotator-entry img { float: right; height: 100%; }
.marketing-promo-badge { height: 200px; width: 200px; position: fixed; left: 0; top: 0; background-image: url("../../images/png/as-seen-on-tv.png"); background-image: url("../../images/svg/as-seen-on-tv.svg"), none !important; background-repeat: no-repeat; }
.fluid-width-video-wrapper { padding-top: 0 !important; }
.youtube { display: none; }
/* RIGHT HAND SIDE */
#password-reset-form .primary-button { margin-bottom: 22px; }
.form-container.security-info { padding: 80px 30px 30px; float: none; margin: 0 auto; }
.form-container.security-info .primary-button { margin-bottom: 30px; }
.logo-container { margin-bottom: 20px; float: left; display: block; width: 100%; max-width: 338px; position: relative; }
.form-container { float: left; max-width: 650px; padding:150px 30px 30px; }
.form-container.force-reset-password { max-width: 475px; }
.form-container p { clear: both; float: left; }
.left-container.half { border-right: 0 none;  padding-right: 15px; }
.right-container.half { padding-left: 15px; padding-bottom: 30px; }
.left-container h2 { margin-bottom: 15px; }
.form-container h1 { clear: both; }
.form-container h2 { width: 100%; clear: both; }
.left-container.half .primary-button, .right-container.half .primary-button, .left-container.half .fomrfield, .right-container.half .formfield, #terms { float: left; }
.right-container h2 span { font-size: 0.65em; }
.right-container.half h2 { margin-bottom: 17px; }

/* Forms */
.formfield-medium {
    max-width: 300px;
}

/* UNSUBSCRIBE */
.unsubscribe-form .secondary-button, #unsubscribe-container .primary-button { width: 100%; float: left; }
.unsubscribe-form h2 { margin-top: 19px; }

/* FOOTER */
footer { height: 55px; background: #ffffff; padding: 20px 0; }
.inner-footer-container { max-width: 600px; margin:auto; }
footer a { width: 16.6666666666%; text-align: center; float: left; display: block; color: #5f5f5f; font-size: 0.8em; }
footer .inner-footer-container a { width: 13.28571428571429%;}
.inner-footer-container a.drope { width:15.5%; }

/* LANDING PAGE */
h1.landing-header { font-family:"AvenirNextLTW01-UltraLi", "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 4.4em; margin-left: -7px; clear: both; }
#terms { text-align: center; width: 100%; margin-top: 20px; }
#terms, #remember-me, .forgot-pw-link { font-size: 0.8em; }
.forgot-pw-link { float: right; margin-top: 28px; }
#remember-me { margin-top: 20px; float: left; }
#remember-me * { float: left; margin: 0 10px 0 0; }
#remember-me .checkbox-label { padding-top: 7px; }

/* CAPTCHA */
.captcha-image { border-radius: 5px; max-width: 100%; }

/* STEP 2 */
.left-container.half label, .name-container { float: left; width: 100%; }
.name-container div { float: left; width: 50%; padding-right: 7px; }
.name-container div.lastname { padding-left: 7px; padding-right: 0; }
.form-container fieldset { margin: 10px 0; float: left; width: 100%; }
.firstname p.error { width: 200%; }
#gender-container { padding-top: 10px; height: 35px; }
.showpasswordlabel.checkbox-label { margin-top: 0; }
p.error { width: 100%; }

/* LAST STEP */
.welcome-wrap { background: #f3f1f2; float: left; width: 100%; height: 100%; }
.welcome-wrap .image-bg { margin-top: 0; }
.welcome-wrap .form-container { padding: 0 30px 30px; float: left; margin: 0; }
#welcome-logo { margin: 0 auto; max-width: 704px; width: 100%; margin-top: 40px; }
#welcome-logo hgroup  { background: #f3f1f2; }
#welcome-logo hgroup h1 { float: left; text-transform: none; }
#welcome-logo hgroup a { float: left; margin-left: 10px; }
#welcome-logo hgroup a img { margin-top: 23px; }
#welcome-logo hgroup a img[src$=".png"] { width:261px; }
.welcome-wrap .primary-button { float: left; max-width: 150px; }

/* ABOUT AND CONTACT */
.video-container { position: absolute; margin-top:150px; }
#as-seen-in img { width: 100%; }
.about-video { width: 100%; max-width: 597px; float: right; }
.about-video a { display: block; width: 100%; max-width: 537px; }
.about-video a img { width: 100%; border: 10px solid #ffffff; border-radius: 5px; box-shadow: 0 12px 17px -6px #d3d3d3; }
.button-container .primary-button, .button-container .secondary-button { float: left; width: auto; margin-right: 15px; }
.form-container.right { margin-left: 37%; }
#futurefifty { padding: 20px 0; float: left; }
#futurefifty img, #futurefifty p { float: left; }
#futurefifty p { width: 55%; clear: right; padding: 8px 0 0 5%; }

/* FORGOTTEN PASSWORD */
.forgotten-button { margin-top: 0 !important; width: auto; margin-left: 10px; }

/* UNSUBSCRIBE */
#unsubscribe-container { width: 100%; padding: 100px 30px 0; max-width: 450px; margin: 0 auto; }
#unsubscribe-container p { padding-top: 30px; padding-bottom: 10px; }
#unsubscribe-container p.minor { color: #808080; padding-top: 40px; clear: both; }
#unsubscribe-container p.info { margin-bottom: 0; padding-bottom: 0; }
.unsubscribe-form { max-width: 350px; margin-top: 40px; }

/* RESET PASSWORD*/
.password-strength-checker.reset #pwdMeterBox {max-width: 280px;}

/* PASSWORD UPDATE */
.passwordupdate p {line-height: 30px; }
@media screen and (max-width: 1084px) {
    .form-container { padding-top: 30px; }
}

/* Drop everything page */
.drop-everything .form-container { margin:auto; float:none; max-width: 785px; text-align: center; padding: 60px 30px 30px; }
.drop-everything .logo-container { margin: 0 auto 20px; float:none; max-width: 500px; }
.drop-everything a.logo-container span#drop-everything { width: 305px; height: 70px; left: 320px }
.drop-everything a.logo-container img.svg { height: 100%; width: 100%; max-height: 100%; max-width: 100%;  }
.drop-everything h1 { font-size: 5.25em; }
.de-video { float: left; height: auto; position: relative; width: 100%; margin: 0 auto 40px; }
.drop-everything .form-container p { max-width:100%; }
.fluid-width-video-wrapper { height: 360px; }
.wrap.about .fluid-width-video-wrapper { height: auto; }
.fluid-width-video-wrapper iframe { position: relative !important ; }

/* slogan feature - sec-3418 */
a.logo-container span#drop-everything { display:block; position:relative; top: -10px; left: 210px; width:215px; height: 50px; }
a.logo-container span#drop-everything svg { width: 100%; height:100%; }

@media screen and (max-width: 1050px) {
    .image-bg { display: none; }
    .form-container, .video-container { width: 100%; margin: 0 auto; float: none; }
    .video-container { float: left; height: auto; position: relative; margin-bottom: 30px; }
    .about-video { padding-top: 30px; float: none; margin: 0 auto; }
    .form-container.right { margin: 0 auto; }
}
@media screen and (max-width: 778px) {
    .formfield-medium {
        width: 100%;
        max-width: 100%;
        padding-right: 0;
        float: left;
    }
    hgroup h1 { padding-left: 15px; padding-right: 15px; }
    .left-container.half, .right-container.half { padding-left: 0; padding-right: 0; }
    .name-container div { float: left; width: 100%; padding-right: 0; max-width: 100%; }
    .name-container div.lastname { padding-left: 0; }
    h1.landing-header, .mobile-hide { display: none; }
    footer { height: auto; padding: 0; }
    .inner-footer-container { padding: 0; background: #e9e7e8; max-width: 100%; border-top: 1px solid #c6c5c1; }
    footer a { float: none; width: 100% !important; padding: 15px 0; border-bottom: 1px solid #c6c5c1;  }
    .a-original .button-container .primary-button, .a-original .button-container .secondary-button { width: 100%; margin-left: 0; margin-right: 0; margin-bottom: 20px; }
    .forgotten-button { width: 100%; margin-left: 0; }
    #futurefifty p { width: 100%; padding: 0; }
}
@media screen and (max-width: 740px) {
    .drop-everything a.logo-container span#drop-everything { margin:auto; left: 0; top: 0; }
    .drop-everything h1 { font-size: 3.25em; }
}
@media screen and (max-width: 568px) {
    #welcome-logo hgroup h2 { padding: 0 22px; width: 270px; float: left; margin: 10px 0 0;}
}
@media screen and (max-width: 400px) {
    #logo, #logo-link { width: 100%; }
    #welcome-logo hgroup h1 { font-size: 2.5em; }
    #welcome-logo hgroup a { margin-left: 0; float: left; padding: 0 20px; width: 100%; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
    .drop-everything h1 { font-size: 2.25em; }
    .drop-everything a.logo-container span#drop-everything { width: 170px; top: -15px; }
    .drop-everything .logo-container { margin:0; }
}

/* FEATURE - Splash Page - SEC-2268 */
@media only screen
and (min-device-width : 414px)
and (max-device-width : 736px)
and (-webkit-min-device-pixel-ratio : 3) {
    #welcome-logo hgroup a img { margin: 10px 0 0 10px; }
}
@media screen and (max-width: 778px) {
    .inner-footer-container { padding: 0; background: #fff; max-width: 100%; border-top: 0px solid #c6c5c1; }
}

@media screen and (max-width: 600px) {
    /* mobile layout feature - sec-4087 */
    #loginContent.mobile_login_layout .primary-button.amazon-login-button,
    #loginContent.mobile_login_layout .primary-button.email-login-button,
    #loginContent.mobile_login_layout .primary-button.paypal-login-button,
    #loginContent.mobile_login_layout .primary-button.fb-login-button {
        width: 48% !important;
        margin: 0 10px 10px 0;
        height: 67px;
        padding: 22px 5px 20px 55px !important;
        font-size: 11px;
        text-align: left;
        white-space: normal;
        background-position: 15px center;
    }
    #loginContent.mobile_login_layout .primary-button.amazon-login-button,
    #loginContent.mobile_login_layout .primary-button.email-login-button {
        margin: 0 0px 10px 0;
    }
    #loginContent.mobile_login_layout .primary-button.fb-login-button { background-position:25px center  }
    #loginContent.mobile_login_layout .primary-button.paypal-login-button { background-position:20px center  }
    #loginContent.mobile_login_layout .form-container {
        padding-top: 15px;
    }
    #loginContent.mobile_login_layout .primary-button.email-login-button,
    #loginContent.mobile_login_layout .primary-button.email-login-button:hover {
        background-size: 33px;
        background-position: 11px center;
    }
    #loginContent.mobile_login_layout .logo-container,
    #loginContent.mobile_login_layout .left-container.half { margin: 0px; }
    #loginContent.mobile_login_layout .right-container.half { margin-top: 15px; }
    #loginContent.mobile_login_layout .form-container h2 { margin-top:5px; }

    /* slogan feature - sec-3418 */
    a.logo-container span#drop-everything { top: -10px; left: 0px; margin: auto;  }
    a.logo-container span#drop-everything svg { width: 100%; height:100%; }
}