/********

    Helpful Info

    - Colors
        - Input border: #D0D0D0
        - Gray text: #9D9D9D
        - Main Blue: #007BC4
        - Blue Anchor Text: #4FACF9

    - Inputs
        - Border-radius: 10px

    - Typography
        - Font Stack: ProximaNova, sans-serif

*********/

/*** Flow Header ***/
.page-container {
    margin-top: 0;
}

.header {
    margin-bottom: 24px;
    margin-top: 12%;
}

.account-setup .header .flow-header {
    margin: 0;
}

.flow-header.flow-header-code-signup > .account-banner,
.flow-header.flow-header-code-signup.flow-header-with-poster > .account-banner {
    content: "";
    display: block;
    height: 40px;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1;
}

.account-setup .header .flow-header-discount .header-text-container .heading,
.account-setup .header .flow-header .header-text-container .heading {
    color: #333e48;
    font-weight: bolder;
    padding: 0 10px;
    text-align: center;
}

.header-text-container.zip-only-header .heading {
    font-size: 22px;
}

.account-setup .header .header-text-container.zip-only-header .sub-heading {
    font-size: 14px;
    margin: 8px auto;
    width: 85%;
}

.account-setup .flow-header-with-image .sub-heading {
    color: #252d34;
}

.account-setup .header .flow-header-with-image .movie-poster {
    width: 25%;
}

.account-setup .header .flow-header-with-image .header-text-container {
    width: calc(75% - 22px);
}

.account-setup .ticketing-user-warning-container {
    align-items: flex-start;
    border-left: 4px solid #ffb600;
    border-radius: 4px;
    top: 30px;
    box-shadow: 0px 0px 24px 8px rgba(0, 0, 0, 0.16), 0px 5px 20px 0px rgba(0, 0, 0, 0.1);
    display: flex;
    height: 86px;
    margin: auto;
    position: relative;
    vertical-align: top;
    width: 98%;
}

.ticketing-user-warning-container .warning-icon {
    background-image: url("/content/images/icons/warning.svg");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: auto;
    margin: 0px auto auto 2%;
    padding: 0px 8px 34px 12px;
}

.ticketing-user-warning-container .error-banner {
    margin-left: 1%;
}

.account-setup .ticketing-user-warning-container .error-banner .error-banner-title,
.account-setup .ticketing-user-warning-container .error-banner .error-banner-content {
    color: black;
    font-size: 14px;
    line-height: 20px;
    text-align: left;
}

.account-setup .ticketing-user-warning-container .error-banner .error-banner-title {
    font-weight: 600;
    margin: 10px auto -10px;
}

.account-setup .ticketing-user-warning-container .error-banner .error-banner-content {
    font-weight: 400;
}

/* Sign Up Banner */
.account-setup > .header > .flow-header > .account-banner,
.account-setup > .header > .flow-header-discount > .account-banner,
.account-setup > .header > .flow-header.is-ios > .account-banner,
.account-setup > .header > .flow-header-discount.is-ios > .account-banner {
    background-color: #007bc4;
    background-image: url("/content/images/banners/SignupBanner_600x80_July_v2.png");
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: block;
    height: auto;
    left: 0;
    padding-top: 13.3333%;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1;
}

/*** User Data Form ***/
.account-setup .user-data-form {
    width: 100%;
    margin: 0;
}
.account-setup .user-data-form .additional-text {
    margin-top: 5px;
    margin-left: 30px;
    font-size: 16px;
}

.account-setup .user-data-form .vudu-text-box-with-label.email {
    margin-bottom: 0;
}

.account-setup .user-data-form .vudu-text-box-with-label.password {
    margin: 0;
}

.account-setup .user-data-form .tos {
    margin-top: 20px;
}

/** Button **/
.account-setup .user-data-form .big-green-button {
    width: 100%;
    padding: 0;
    margin: 20px 0;
    position: relative;
}

/* "OR" divider attached to label */
.account-setup .user-data-form > .gwt-Label:after {
    content: "OR";
    display: block;
    width: 100%;
    margin-top: 20px;
    text-align: center;
}

/*** Mobile Options Panel ***/
.mobile-options-panel {
    margin-top: 20px;
}

/** Walmart **/
.mobile-options-panel .option:first-child {
    background-color: #007bc4;
}

/** Facebook **/
.mobile-options-panel .option:nth-child(3) {
    background-color: #415b94;
}

/** Sign In **/
.mobile-options-panel .option:nth-child(5) {
    border: 2px solid #007bc4;
    color: #007bc4;
}

/** Sign In when MoveFNowAccount Button presents **/
.mobile-options-panel .option:nth-child(6) {
    border: 2px solid #007bc4;
    color: #007bc4;
}

/*** Payment Setup ***/
.payment-setup-panel .error-label {
    font-size: 14px;
    flex-grow: 1;
    flex-basis: 0;
    margin-bottom: 12px;
}

.payment-setup-panel .billing-address-form .vudu-text-box-with-label,
.vudu-text-box-with-label.wmt-gift-card-number,
.vudu-text-box-with-label.wmt-gift-pin-code,
.payment-setup-panel .vudu-payeezy-form .vudu-text-box-with-label {
    width: 100%;
}

.payment-setup-panel .credit-card-option,
.payment-setup-panel .paypal-option,
.payment-setup-panel .wmt-gift-card-option {
    width: 14px;
    height: 14px;
    margin-left: 0;
    color: #9d9d9d;
    outline: none;
    font-size: 0px;
    background-image: url("/content/images/add-plus-tiny.svg");
}

.payment-setup-panel .credit-card-option.expanded,
.payment-setup-panel .paypal-option.expanded,
.payment-setup-panel .wmt-gift-card-option.expanded {
    background-image: url("/content/images/add-minus-tiny.svg");
}

.payment-setup-panel .credit-card-option:focus,
.payment-setup-panel .paypal-option:focus,
.payment-setup-panel .wmt-gift-card-option:focus {
    outline: dotted;
}

.account-setup .widget-title {
    color: #9d9d9d;
    font-size: 14px;
    font-weight: bold;
    margin: 24px 0 0 10px;
}

.account-setup .widget-title:first-child {
    margin-top: 0;
}

.payment-setup-panel .billing-address-form .additional-text {
    margin: 15px 0;
    font-size: 16px;
}

.payment-setup-panel .billing-address-form .tos-text {
    margin: 0;
    font-size: 12px;
}

.payment-setup-panel .buttons-container {
    font-weight: bolder;
}

.payment-setup-panel .buttons-container .gwt-Anchor {
    border: 1px solid #3478c1;
    display: inline-block;
    width: 100%;
    height: 50px;
    border-radius: 5px;
    padding-top: 17px;
    box-sizing: border-box;
    color: #3478c1;
}

/** Address Form **/
.payment-setup-panel .billing-address-form {
    margin: 0;
}

.payment-setup-panel .billing-address-form .state-dropdown {
    width: calc(100% - 5px);
}

/** Button **/
.payment-setup-panel .buttons-container {
    margin: 0;
}

.payment-setup-panel .buttons-container .custom-button {
    margin: 0 0 15px;
    width: 100%;
    min-width: 0;
}

/** CC **/
.vudu-payeezy-form .credit-card-header {
    font-size: 20px;
    font-weight: bold;
}

.vudu-payeezy-form .credit-card-header,
.vudu-payeezy-form .credit-card-warning {
    width: 100%;
}

.vudu-payeezy-form .credit-card-warning {
    margin: 0 0 16px 0;
}

.payment-setup-panel .vudu-payeezy-form {
    margin: 20px 0 20px 0;
    overflow: visible;
}

.payment-setup-panel .vudu-payeezy-form > div {
    display: flex;
}

.payment-setup-panel .vudu-payeezy-form .vudu-text-box-with-label.expiration-input {
    margin-top: 0;
    margin-right: 4.9px;
}

.payment-setup-panel .vudu-text-box-with-label.card-number {
    margin-top: 0;
}

.payment-setup-panel .cvv-container {
    display: inline-block;
    width: calc(50% - 5px);
}

.cvv-container:after {
    content: "";
    display: table;
    clear: both;
}

.payment-setup-panel .vudu-payeezy-form .vudu-text-box-with-label.cvv-input {
    width: 100%;
    margin-top: 0;
    margin-bottom: 0;
}

.payment-setup-panel .cvv-hint {
    width: 25px;
    height: 25px;
    font-size: 16px;
    background-color: buttonface;
    top: 50%;
    transform: translateY(-50%);
}

.payment-setup-panel .cvv-hint.show-label {
    top: 57%;
}

.cvv-hint-row {
    color: #000;
}

.payment-setup-panel .vudu-payeezy-form .vudu-text-box-with-label.zip {
    width: 48%;
    margin-top: 0;
}

.card-type + .error-label {
    margin-bottom: 15px;
}

.vudu-payeezy-form > div:last-child .error-label:first-child {
    float: left;
    margin-bottom: 10px;
}

.vudu-payeezy-form > div:last-child .error-label:last-child {
    clear: left;
}

/* MCWE ad */
.master-card-billboard {
    width: 100%;
}

.master-card-billboard img {
    margin: 20px 5% 0px;
    width: 90%;
}

.account-setup .header .flow-header-discount-with-image .movie-poster {
    border: 1px solid #808080;
    display: inline-block;
    margin-right: 20px;
    width: 25%;
}

.account-setup .header .flow-header-discount-with-image .header-text-container {
    display: inline-block;
    text-align: left;
    vertical-align: top;
    width: 68%;
}

.account-setup .header .flow-header-discount-with-image .header-text-container .heading {
    font-size: 15px;
    font-weight: bolder;
    text-align: left;
}

.account-setup .header .flow-header-discount-with-image .header-text-container .sub-heading {
    font-size: 14px;
    margin: 8px auto;
    text-align: left;
    width: 100%;
}

@media (orientation: landscape) {
    .header {
        margin-top: 15%;
    }

    .master-card-billboard {
        margin-left: 5%;
        width: 60%;
    }
    .master-card-billboard img {
        height: 90px;
        margin: 20px auto;
        width: 90%;
    }

    .account-setup .header .flow-header .header-text-container .heading {
        margin-top: 30px;
    }

    .account-setup .header .header-text-container.zip-only-header .sub-heading {
        margin: 8px auto 0;
        width: 65%;
    }
}

/* targeting tablets */
@media (min-width: 600px) {
    .account-setup .header .header-text-container.zip-only-header .sub-heading {
        margin: 8px auto 0;
        width: 50%;
    }

    .account-setup .header .flow-header-discount-with-image .header-text-container .heading {
        font-size: 22px;
        font-weight: bolder;
        text-align: center;
        width: 100%;
    }

    .account-setup .header .flow-header-discount-with-image .header-text-container .sub-heading {
        font-size: 20px;
        margin: 8px auto;
        text-align: center;
        width: 100%;
    }
}

/** PayPal **/
.paypal-panel .paypal-body {
    margin: 16px 0 16px 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: block;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.paypal-panel .paypal-body .buttons-container .gwt-Anchor {
    text-align: center;
}

.paypal-button {
    width: 62.86px;
    height: 22px;
    margin-bottom: 16px;
}

/** Gift Card **/
.wmt-gift-card-form-panel {
    margin: 30px 0 15px 0;
}

.wmt-gift-card-img-panel > img {
    width: 100%;
    height: auto;
}

.wmt-gift-card-form table.green-button.custom-button {
    min-width: 0;
}

.wmt-gift-cards-list {
    margin: 30px 0;
}

.wmt-gift-card {
    width: 100%;
    margin: 0;
}

.wmt-gift-card .wmt-gift-card-info {
    width: 260px;
    height: 163.28px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.wmt-gift-card .wmt-gift-card-info > div:nth-child(n + 1) {
    margin: 0;
    width: 50%;
}

.wmt-gift-card .wmt-gift-card-info > div.gwt-Label:first-child,
.wmt-gift-card .wmt-gift-card-info > div.wmt-gift-card-balance {
    margin-top: calc(100% / 4.3333);
}

.wmt-gift-card .wmt-gift-card-info > div:nth-child(2),
.wmt-gift-card .wmt-gift-card-info > div:nth-child(4) {
    font-size: 20px;
}

.wmt-gift-card .wmt-gift-card-info > div.gwt-Label {
    margin-left: calc(100% / -6.5);
}

.wmt-gift-card .wmt-gift-card-button-container .wmt-gift-card-delete {
    width: 100%;
}

/**** GiftCard form */
.payment-setup-panel .wmt-gift-card-form .wmt-giftcard-limit {
    margin-bottom: 16px;
}

.payment-setup-panel .wmt-gift-card-form .wmt-giftcard-header {
    font-size: 20px;
    font-weight: bolder;
}

.no-zip-panel.payment-setup-panel .wmt-gift-card-form .wmt-giftcard-header {
    font-size: 16px;
    font-weight: normal;
}

.payment-setup-panel .card-images {
    display: block;
    position: absolute;

    right: 0;
    top: 0;
}

.payment-setup-panel .card-images > div {
    display: inline-block;
    height: 20px;
    width: 27px;
    margin-left: 4px;
    background-size: 27px 20px;
    background-repeat: no-repeat;
    background-position-y: 0px;
}

.wmt-gift-card-error {
    margin: 16px 0;
}

.no-zip-panel.payment-setup-panel .wmt-gift-card-error {
    margin: initial;
}

.payment-setup-panel .wmt-gift-card-form .card-data {
    display: flex;
}

.payment-setup-panel .wmt-gift-card-form .vudu-text-box-with-label {
    margin: 10px 0 0 0;
}

.payment-setup-panel .wmt-gift-card-form .wmt-gift-card-img-panel {
    margin: 10px 0 0 15px;
}

.no-zip-panel.payment-setup-panel .wmt-gift-card-form .wmt-gift-card-img-panel {
    margin: 0;
}

.payment-setup-panel .wmt-gift-card-form .checkbox-panel input {
    vertical-align: middle;
}

.payment-setup-panel .wmt-gift-card-form .checkbox-panel a {
    padding-left: 10px;
}

.no-zip-panel.payment-setup-panel .wmt-gift-card-form .checkbox-panel {
    margin: 10px 0 20px;
}

.payment-setup-panel .wmt-gift-card-form .tos-text {
    margin: 10px 0 0 0;
    font-size: 12px;
}

.account-setup-or-separator {
    display: flex;
    padding-left: 24px;
    padding-right: 24px;
}

.close-icon {
    width: 16pt;
    height: 16pt;
    background-image: url("/content/images/icon-close.svg");
    background-repeat: no-repeat;
    background-color: #121212;
    border: transparent;
}

/*** Flow Popup ***/
.flow-popup-fandango {
    background-color: #121212;
    padding: 20px 0 20px 0;
    margin: 250px 16px 0 16px;
    border-radius: 8px;
}

.flow-popup .popupContent {
    padding-top: 180px;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.flow-popup .primary-text {
    font-size: 17px;
    text-align: center;
}

.flow-popup-fandango .primary-text {
    font-size: 20px;
    font-weight: bold;
    color: white;
    text-align: center;
    width: 100%;
}

.flow-popup-fandango .primary-text .fah-email {
    height: auto;
}

.flow-popup .primary-text ul {
    text-align: left;
}

.flow-popup .secondary-text {
    color: #000;
    margin-bottom: 20px;
}

.flow-popup-fandango .secondary-text {
    color: white;
    font-size: 14px;
    text-align: center;
    line-height: 20px;
    margin-top: 12px;
    padding: 0px 24px 20px 24px;
}

.flow-popup .skip-billing-warning-msg-1,
.flow-popup .skip-billing-warning-fandango-msg-1 {
    margin-bottom: 50px;
}

.flow-popup .skip-billing-warning-msg-1:before,
.flow-popup .skip-billing-warning-fandango-msg-1:before {
    content: "";
    display: block;
    width: 100%;
    height: 37px;
    margin: 50px 0;
    position: absolute;
    top: 0;
    left: 0;
}

.flow-popup .skip-billing-warning-msg-1:before {
    background: url("/content/images/logo_blue.svg") no-repeat center center;
    background-size: 130px 37px;
}

.flow-popup .skip-billing-warning-fandango-msg-1:before {
    background: url("/content/images/fandango-at-home-logo.svg") no-repeat center center;
    background-size: 80% 37px;
}

.flow-popup .skip-billing-warning-msg-1:after,
.flow-popup .skip-billing-warning-fandango-msg-1:after {
    content: "Payment";
    width: 100%;
    position: absolute;
    top: 120px;
    left: 0;
    text-align: center;
    font-size: 22px;
    color: #9d9d9d;
}

.flow-popup .button-panel {
    height: 150px;
    margin-top: 0;
    position: relative;
}

.flow-popup .button-panel > tbody > tr > td:first-child + td {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.flow-popup .button-panel > tbody > tr > td:first-child {
    position: relative;
    top: 70px;
}

.flow-popup-fandango .button-panel > tbody > tr > td:first-child {
    top: 12px;
}

.flow-popup .button-panel .gray-button .custom-button-center {
    height: auto;
    color: #9d9d9d;
    font-size: 16px;
}

/* UV Invite Acceptance */
.uv-options-container .uv-image {
    background-size: contain;
}

.uv-options-container .uv-options .gwt-RadioButton input {
    width: 15px;
    height: 15px;
}

.uvshare-recipient-join-1,
.uvshare-recipient-decline {
    color: #000;
    font-size: 17px;
}

.uvshare-recipient-join-2 {
    margin-top: 10px;
}

.uvshare-recipient-join-2,
.uvshare-recipient-join-3 {
    padding-left: 40px;
    color: #000;
}

.uv-policy-panel.uv-policy-panel-uvshare {
    margin-top: 20px;
}

.uv-policy-panel .vudu-checkBox {
    font-size: 14px;
    background-size: 15px;
}

.uv-sharing-options-container {
    padding-bottom: 0;
}

.uv-options-container .uv-options {
    margin-bottom: 0;
}

.uv-panel .custom-button {
    margin-top: 10px;
}

.uvshare-recipient-uv-already-linked-warning-1,
.uvshare-recipient-uv-already-linked-warning-2 {
    color: #000;
}

.uvshare-recipient-profile-create-button {
    margin: 0 !important;
    display: inline-block;
}

.uvshare-recipient-profile-create-page-uvfaq {
    text-align: left;
    padding: 0;
}

.uv-panel .additional-text-uvshare {
    color: #000;
    font-size: 15px;
}

.uv-panel .buttons-panel {
    background-color: transparent;
}

/* MA */
.movies-anywhere {
    width: auto;
    padding-bottom: 0;
    border-radius: 0;
    margin: 40px 0 0 0;
}

.movies-anywhere .custom-flow-header {
    margin: 0px 0px 10px 0px;
}

.movies-anywhere .custom-flow-header .flow-header .insta-watch-banner {
    height: 75px;
    width: 90%;
    padding: 4px 5%;
    background-color: #007dc6;
}

.movies-anywhere .custom-flow-header .flow-header .insta-watch-banner .insta-watch-logo {
    background-image: url(/resources/idc/instawatch_logo.png), url(/resources/idc/Vudu-FanLogoWeb.png);
    background-size: 30%, 50%;
    background-position: left, right;
    background-repeat: no-repeat;
    height: 75px;
}

.movies-anywhere .custom-flow-header .flow-header-with-poster .movie-poster {
    width: 25%;
    margin: 10px 20px 0 10px;
}

.ma-main-panel {
    padding: 0;
}

.movies-anywhere .ma-logo {
    width: 280px;
    height: 110px;
}

.ma-account-title {
    width: auto;
}

.movies-anywhere .ma-description {
    padding: 0 20px;
}

.ma-about-to-connect-message {
    padding: 20px 20px 0px 20px;
}

.ma-account-title {
    padding: 0 20px;
}

.ma-link-frame {
    width: calc(100% - 5px);
}

.ma-main-panel .vudu-button {
    background-color: #007bc4;
    color: #fff;
}

@media (max-width: 320px) {
    .ma-account-title {
        font-size: 18px;
    }
}

@media (min-width: 700px) {
    .movies-anywhere .custom-flow-header .flow-header .insta-watch-banner {
        height: 95px;
        padding: 2% 5%;
    }

    .movies-anywhere .custom-flow-header .flow-header .insta-watch-banner .insta-watch-logo {
        background-size: contain, 50%;
    }
}

/* Account create heading font sizes to make it be one line */
@media (max-width: 290px) {
    .header-text-container.zip-only-header .heading {
        font-size: 14px;
    }
}

@media (min-width: 290px) and (max-width: 340px) {
    .header-text-container.zip-only-header .heading {
        font-size: 17px;
    }
}

@media (min-width: 340px) and (max-width: 360px) {
    .header-text-container.zip-only-header .heading {
        font-size: 18px;
    }
}

@media (min-width: 361px) and (max-width: 400px) {
    .header-text-container.zip-only-header .heading {
        font-size: 20px;
    }
}

@media (min-width: 400px) {
    .header-text-container.zip-only-header .heading {
        font-size: 22px;
    }
}

#reactHeader {
    display: none;
}
